<rb>

elliezub's avatar
Published Aug 28, 2023
Contribute to Docs

The <rb> element designates the base text for ruby annotations in East Asian languages. It must be within <ruby> tags and is often paired with <rt> for pronunciation guides and <rp> for fallback rendering.

Note: The <rb> tag is deprecated, meaning it’s no longer recommended for use in new projects. Instead, characters can be written directly within the <ruby> tags.

Syntax

<ruby>
<rb>Base text goes here</rb>
<rp>(</rp> <rt>Annotation text goes here</rt> <rp>)</rp>
</ruby>

Example

The example below showcases how the <rb> tag is used to transliterate the Chinese characters meaning 'I like to write code' inside a <ruby> element.

<ruby>
<rb></rb><rt>I</rt> <rb>喜欢</rb><rt>like</rt> <rb></rb><rt>to write</rt>
<rb>程序</rb><rt>code</rt>
</ruby>

This is what it looks like in the browser:

Output of the above code with English translations

Another approach is to replace the English translations with Pinyin, which represents the Chinese characters using the Roman alphabet for pronunciation guidance. Here’s an example:

<ruby>
<rb></rb><rt></rt> <rb>喜欢</rb><rt>xǐ huān</rt> <rb></rb><rt>xiě</rt>
<rb>程序</rb><rt>chéng xù</rt>
</ruby>

Running this code will display the following:

Output of the above code with Pinyin transliterations

All contributors

Contribute to Docs

Learn HTML on Codecademy