HTML5における＜rb＞タグの使い方

<rb>タグは、ルビを振る際に使用するタグの１つです。RBというのは、Ruby Baseというものの略で、ルビを振る対象になる文字を指定します。今回は、HTML5における＜rb＞タグの使い方をご紹介します。

HTML5における＜rb＞タグの使い方

<rb>はルビを振る対象になる文字を指定して、テキストをブロック分けしたい時に使用します。

通常ルビを振りたい場合は、<ruby>タグで全体を囲み、<rt>タグでルビを囲むことでルビを振ることができます。実際には以下のようになります。

表示サンプルです。此のように、ルビを振ることができました。

これを、文字ごとに分割してルビを振りたい場合に、<rb>タグを使い、文字ごとに囲んで使用します。サンプルコードです。<rt>も<rb>で囲んだものと同様に区切って囲んでください。

これで区切りごとにルビを表示させることができます。ただ、chromeなどの未対応のブラウザでは以下のように表示されてしまうことがあります。

一番最初のコードは、以下のような状態になっているのと同じことになります。つまり、<rb>タグが省略されている状態ということです。

まとめ

今回は<rb>タグの紹介を行いましたが、HTML5では一番最初のコード例のように<ruby>タグで省略することができます。文字ごとに区切ってルビを振りたい場合は<rb>タグを使いましょう。