Home > Article > Web Front-end > Detailed explanation of tag in html5

Detailed explanation of tag in html5

黄舟Original: 2017-07-17 13:32:482889browse

Today I learned the ruby tags of HTML5. I thought it was quite interesting, so I’ll record it.

ruby can be used as comment tags, with rp and rt tags inside.

ec41f2147470148e85ad0337a362103e Tag defines annotation or phonetic notation.

515718f19dfe6612658be14be18aa0ec Tell browsers that do not support ruby elements how to display them.

7240f116d85a7ee375466871bc33670a The tag defines the content text of the ruby annotation.

My first reaction after learning this tag is that I have a way to make kana annotations for Japanese words that I can’t read! ! !

The code is as follows, to make a small comment on a Japanese sentence:

<!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>

The effect is as follows:

Firefox Google:

There are also some browsers that cannot support the ec41f2147470148e85ad0337a362103e tag. At this time, the 515718f19dfe6612658be14be18aa0ec tag is particularly important. I understand 515718f19dfe6612658be14be18aa0ec to mean "character". Browsers with good character will display it in the form of comments above, as shown in the picture above, while those with bad character will need the 515718f19dfe6612658be14be18aa0ec tag to supplement the comments.

The text inside 515718f19dfe6612658be14be18aa0ec will not be displayed when the browser is compatible. Only the text inside 7240f116d85a7ee375466871bc33670a will appear as annotations above. In the case of incompatibility, the text of the annotation in 7240f116d85a7ee375466871bc33670a will be displayed later, as shown in the figure below. At this time, the content packaged in 515718f19dfe6612658be14be18aa0ec can be displayed.

The above is the detailed content of Detailed explanation of tag in html5. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：The difference between tag and

tag in htmlNext article：The difference between tag and
tag in html

See more

Detailed explanation of tag in html5

Related articles