html5中關於標籤的詳解

黄舟
發布: 2017-07-17 13:32:48
原創
2887 人瀏覽過

今天學了HTML5的ruby標籤,覺得挺有趣的,來記錄一下。

ruby可以作註解標籤,內部有rp和rt標籤。

  標記定義註解或音標。

    告訴那些不支援ruby元素的瀏覽器該如何顯示。

      標記定義對ruby註釋的內容文字。

學完這個標籤的第一個反應就是,我有方法給那些不會讀的日文單字做假名註解啦! ! !

程式碼如下,來給一句日文做個小註解:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ruby注释标签</title>
    <style>
        p {
            text-align: center;
        }
    </style>
    </head>
    <body>
    <p>
    <ruby>月明<rp>(</rp><rt>つきあ</rt><rp>)</rp></ruby>かり昇る頃</p>
    <p>灯る <ruby>赤提灯 <rp>(</rp><rt>あかちょうちん</rt><rp>)</rp></ruby></p></body></html>
登入後複製

效果如下:

火狐Google:

還有一些瀏覽器不能支援標籤,這個時候標籤就顯得尤其重要,我理解為「人品」的意思。人品好的瀏覽器就以在上面註釋的形式顯示出來,就如上圖,而人品不好的就需要標籤來補充註釋。

裡面的文字會在瀏覽器相容的時候不顯示出來,只有裡面的文字以在上面註解的方式出現。而不相容的情況,裡面註解的文字會在後面顯示,就如下圖,這個時候裡麵包裹的內容就可以顯示出來。

 

 

以上是html5中關於標籤的詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板