element allows one or more spans of phrasing content to be marked with ruby annotations. Ruby annotations are short runs of text
presented alongside base text, primarily used in East Asian typography as a guide for pronunciation or to include other annotations. In Japanese,
this form of typography is also known asfurigana.
The content model ofrubyp218
elements consists of one or more of the following sequences:
1. One or the other of the following:
◦ Phrasing contentp117
, but with norubyp218
elements and with norubyp218
◦ A singlerubyp218
element that itself has norubyp218
2. One or the other of the following:
◦ One or morertp224
element followed by one or morertp224
elements, each of which is itself followed by anrpp224
elements can be used for a variety of kinds of annotations, including in particular (though by no means limited to) those
described below. For more details on Japanese Ruby in particular, and how to render Ruby for Japanese, seeRequirements for Japanese Text
Mono-ruby for individual base characters in Japanese
One or more hiragana or katakana characters (the ruby annotation) are placed with each ideographic character (the base text). This is used
to provide readings of kanji characters.
Mono-ruby for compound words (jukugo)
This is similar to the previous case: each ideographic character in the compound word (the base text) has its reading given in hiragana or
katakana characters (the ruby annotation). The difference is that the base text segments form a compound word rather than being separate
from each other.
This is semantically identical to the previous case (each individual ideographic character in the base compound word has its reading given in
an annotation in hiragana or katakana characters), but the rendering is the more complicated Jukugo Ruby rendering.
At the time of writing, CSS does not yet provide a way to fully control the rendering of the HTMLrubyp218
element. It is hoped that CSS
will be extended to support the styles described below in due course.
In this example, notice how each annotation corresponds to a single base character.
This example can also be written as follows, using onerubyp218
element with two segments of base text and two annotations
(one for each) rather than two back-to-backrubyp218
elements each with one base text segment and annotation (as in the
In this example, notice again how each annotation corresponds to a single base character. In this example, each compound word
(jukugo) corresponds to a singlerubyp218
The rendering here is expected to be that each annotation be placed over (or next to, in vertical text) the corresponding base
character, with the annotations not overhanging any of the adjacent characters.