HTML & CSS

最終更新日:
公開日:

リファレンス

HTML

ルビ・ベーステキスト

rb要素

ルビを振る対象となるテキストを指定します。ruby要素内で複数のルビを振りたいたい場合に、ルビとテキストの組み合わせを指定する時に使用します。
2016年1月22日時点ではIE、Firefoxのみが対応しています。

サンプルコード

<p><ruby><rb>GrayCode</rb><rb>珈琲</rb><rt>グレーコード</rt><rt>コーヒー</rt></ruby>では、いつも挽きたての珈琲をお楽しみ頂けます。</p>
  • カテゴリー

    なし

  • コンテンツモデル

    フレージングコンテンツ

  • 使用ケース

    ruby要素の子要素として使用

属性

グローバル属性

グローバル属性のみ使用することができます。
グローバル属性について詳しくは、「HTMLのグローバル属性」をご覧ください。

使用例

次のコードは、ルビを振りたい単語を「Internet」「of」「Things」と3つの単語に分け、rt要素で各々に対応する「インターネット」「オブ」「シングス」とルビを振っています。

<p><ruby>
	<rb>Internet</rb> <rb>of</rb> <rb>Things</rb>
	<rt>インターネット</rt><rt>オブ</rt><rt>シングス</rt>
</ruby>は家具や車、家、服など身近なモノをインターネットに繋ぐことで、さらに便利な道具として利用することができる技術を指します。</p>

複数のルビに対応しているブラウザでの表示

対応しているブラウザ表示例

複数のルビに対応していないブラウザでの表示

対応していないブラウザ表示例

こちらの記事は役に立ちましたか?

ありがとうございます。
もしよろしければ、あわせてフィードバックや要望などをご入力ください。

コメントありがとうございます!
運営の参考にさせていただきます。