HTML5タグ虎の巻

rubyタグ

HTML5

rubyは、文字にルビ（ふりがな）を振るタグです。

解説

rubyタグの子要素としてrt、rpを指定します。
ルビは単語全体に指定する事も、漢字毎に指定する事も可能です。

コンテンツ・モデル

カテゴリー (自カテゴリ)	フロー・コンテンツフレージング・コンテンツ
コンテキスト (親カテゴリ)	フレージング・コンテンツを許可する場所
コンテンツ・モデル (子カテゴリ)	フレージング・コンテンツ

属性

rubyタグには以下の属性が指定できます。

【主要グローバル属性】
属性	説明
class	クラスを指定する（例）class="hoge"
id	IDを指定する（例）id="foo"
style	スタイルを指定する（例）style="color:red;"

その他のグローバル属性値については、グローバル属性をご覧ください。

サンプル

単語単位でルビをつける

<ruby>
京都<rt>きょうと</rt>
</ruby>

京都きょうと

文字単位でルビをつける

<ruby>
京<rt>きょう</rt>
都<rt>と</rt>
</ruby>

京きょう都と

rubyタグ非対応ブラウザにも対応した表記

<ruby>
北海道<rp>(</rp><rt>ほっかいどう</rt><rp>)</rp>
</ruby>

北海道(ほっかいどう)

rubyタグが非対応のブラウザだと以下のように表示されます。

北海道(ほっかいどう)

備考

ruby、rt、rpタグはHTML5から正式採用となりました。
HTML4.01時代に一部ブラウザで採用されていたrbタグ（ルビを振る対象文字列を指定するタグ）は、HTML5では採用されていません。
現在の一般的なブラウザではほとんどrubyタグに対応しているため、rpの指定は省略しても問題になることはほとんどありません。

関連項目

rp：rubyタグの子要素として、rubyタグに非対応ブラウザ向けの内容を指定する
rt：rubyタグの子要素として、ルビ（ふりがな）を指定する

HOMEへ　 TOPへ