HTMLリファレンス

<ruby>タグの意味と使い方

<ruby>タグはルビの範囲を指定する(IEが独自に採用)

目次

概要

ルビを表示させるには、まずルビをふりたい漢字部分を<ruby>~</ruby>で囲います。そして漢字の直後にルビとして表示させたいテキストを<rt>~</rt>内に記述します。ルビに対応した環境ではルビが表示されます。
ただし、ruby要素とrt要素だけでルビを表示させている場合、ルビに未対応の環境ではルビのテキストが漢字の直後にそのまま表示されてしまいます。これを「漢字(ルビ)」のように括弧付きで表示させるためにrp要素を利用します。rp要素は、rt要素の直前と直後に配置します。ルビに未対応の環境では括弧付きで表示され、ルビに対応した環境ではrp要素の内容は表示されません。

対応ブラウザ

Chrome Edge Firefox Internet Explorer Opera Safari Android webview Android 版 Chrome Android 版 Firefox Android 版 Opera iOSのSafari
5 12 38 5 15 5 38 14