Web Development Course:
ruby HTML: Main Tips
<ruby>tag represents ruby annotations for East Asian characters.
- It is used to convey the right pronunciation, as some characters have multiple options.
rubytag was introduced in HTML5 and supports all global attributes.
- You cannot omit the ending tag.
Providing Ruby Annotations
ruby tags are used to provide the information on how to pronounce Japanese, Chinese, and Korean characters:
<ruby>攻殻 <rp>（ </rp> <rt>こrうかく</rt> <rp> ）</rp> 機動隊 <rp>（ </rp> <rt>きsどうたtい</rt> <rp> ）</rp> </ruby>
As you can see in the example above, there are a few elements used for HTML ruby annotations:
<ruby>defines a connection between the base text and the ruby HTML text.
- <rt> specifies the ruby HTML text element, which may contain inline elements.
- <rp> surrounds the ruby parentheses for the browsers that do not support ruby HTML text.
Note: the level of support for ruby annotations differs greatly between browsers and their versions: you can check it here.
Mobile Browser Support
HTML5 Tags List: Get to Know the Most Useful Elements
Find HTML5 tags explained and illustrated with beginner-friendly HTML5 examples. Grasp the difference between HTML5 tags & elements and learn to use both!
What Does a !DOCTYPE HTML Do? Explanation and Examples
Doctype HTML: what is it, and what does a doctype do? Learn everything about HTML doctype, its syntax and use here, in doctype HTML guide.