Cover Image for HTML ruby Tag
63 views

HTML ruby Tag

The HTML <ruby> tag is used to annotate small annotations, called “ruby text,” on East Asian characters. It is commonly used in languages such as Japanese, Chinese, and Korean to provide phonetic readings or translations for difficult or uncommon characters.

The <ruby> tag is typically used in conjunction with the <rt> (ruby text) and <rp> (ruby parentheses) tags to define the pronunciation or translation of the base text.

Here’s an example of how the <ruby> tag can be used:

HTML<span role="button" tabindex="0" data-code="<ruby> 漢<rp>(</rp><rt>かん</rt><rp>)</rp> 字<rp>(</rp><rt>じ</rt><rp>)</rp>
<ruby>
     漢<rp>(</rp><rt>かん</rt><rp>)</rp>
     字<rp>(</rp><rt>じ</rt><rp>)</rp>
</ruby>

In the above example, the <ruby> element represents the base text (in this case, the characters “漢字”), and the <rt> elements are used to provide the phonetic pronunciation (in this case, “かん” and “じ”). The <rp> elements are used to enclose the parentheses that surround the ruby text, providing fallback content for browsers that do not support ruby annotations.

It’s important to note that support for the <ruby> tag and its associated elements can vary across different web browsers. Therefore, it’s essential to consider the compatibility requirements of your target audience when using this tag.

The <ruby> tag is a valuable tool for adding pronunciation or translation aids to East Asian characters, enhancing accessibility and understanding for readers of these languages.

YOU MAY ALSO LIKE...

The Tech Thunder

The Tech Thunder

The Tech Thunder


COMMENTS