<rp>
対応ブラウザ | Internet Explorer 5.0 / Chrome 5.0 / Safari 4.1 | ||
---|---|---|---|
タグの分類 |
フロー・コンテンツ フレージング・コンテンツ パルパブル・コンテンツ |
含められるもの | 本文参照 |
使える場所 | フレージング・コンテンツを使える場所 | ||
用例 | <ruby>文<rp>(</rp><rt>も</rt><rp>)</rp>字<rp>(</rp><rt>じ</rt><rp>)</rp></ruby> |
<rp>とは
「RP」とは、「Ruby Parentheses」の略で、文字にルビをふる際に使用するタグです。<ruby>~</ruby>内で有効なタグで、ルビの内容となるテキスト(ルビ文字)を<rt>で指定し、それを囲む記号を<rp>で指定します。
<rp>タグで指定されたテキストは、<ruby>タグに対応しているブラウザでは表示されず、対応していないブラウザの場合のみ表示されます。ルビの内容を囲むかっこなどの記号を入れておき、<ruby>要素に対応していないブラウザで見た時に、どこからどこまでがルビ文字かはっきり分かるようにします。
たとえば、
<ruby>文<rt>も</rt>字<rt>じ</rt></ruby>にルビを<ruby>振<rt>ふ</rt></ruby>る<ruby>際<rt>さい</rt></ruby>に<ruby>使<rt>し<</rt>用<rt>よう</rt></ruby>するタグ
をルビに対応していないブラウザで表示すると、
文も字じにルビを振ふる際さいに使し用ようするタグ
となり、ふりがなが地の文と区別なく表示されるため、文が崩れてしまいます。
<ruby>文<rp>(</rp><rt>も</rt><rp>)</rp>字<rp>(</rp><rt>じ</rt><rp>)</rp></ruby>にルビを<ruby>振<rp>(</rp><rt>ふ</rt><rp>)</rp></ruby>る<ruby>際<rp>(</rp><rt>さい</rt><rp>)</rp></ruby>に<ruby>使<rp>(</rp><rt>し</rt><rp>)</rp>用<rp>(</rp><rt>よう</rt><rp>)</rp></ruby>するタグ
のように各<rt>の前へ<rp>で区切り文字を入れると、<rp>に対応していないブラウザでは
文(も)字(じ)にルビを振(ふ)る際(さい)に使(し)用(よう)するタグ
となります。
サポートしていないタグをブラウザどう扱うかについて、HTMLの仕様上明確な規定はありませんが、多くのブラウザではそのタグ自体を無視し、内容を表示します。そのため<rp>を使うことで、ルビに対応しているブラウザでは<rp>だけを無視して<rt>の内容をルビとして表示、対応していないブラウザでは<rp>と<rt>の両方の内容をそのまま表示、という結果になります。
現在のHTML5の仕様では、<rp>の終了タグは直後に<rt>か<rp>が続く場合、親要素にそれ以上の内容がない場合に省略できるとされていますが、基本的には省略するべきではありません。未知のタグで終了タグが省略された場合のブラウザの挙動はやはり規定がなく、仮にブラウザが自動で終了タグを挿入してDOMツリーを構築するとした場合、どこに終了タグが挿入されるかでスクリプトの挙動が変わることになりえます。
サンプルデモ
<ruby> 薔薇 <rp>(</rp> <rt>バラ</rt> <rp>)</rp> </ruby>
Internet Explorer 10での表示
Google Chromeでの表示
Firefox(非対応)での表示