各ウェブブラウザでのルビの実装状況

このページでは、適切なルビ表示を実現するJavaScript・ruby_enabler2.js がオフになっています。つまり、あなたが現在お使いのウェブブラウザがルビをどのようにレンダリングするのかを確かめることができます。

ruby_enabler2.js が有効な場合のルビ表示がどのようになるかは →こちらのページでご確認ください。

各ウェブブラウザの最新版での対応状況を記載しています。

HTML5形式のグループルビ:新垣結衣あらがきゆい:熟語にひとまとめにルビ。
<ruby><rb>新垣結衣</rb><rt>あらがきゆい</rt></ruby>
※適切に表示 … Internet Explorer,Chrome,Safari,Opera,Firefox(38以降)
※上手く表示されない … Firefox(37以前)
HTML5形式のモノルビ:のぞみ:文字ごとにルビ。
<ruby><rb>佐</rb><rt>さ</rt><rb>々</rb><rt>さ</rt><rb>木</rb><rt>き</rt><rb>希</rb><rt>のぞみ</rt></ruby>
※適切に表示 … Internet Explorer,Chrome,Safari,OperaFirefox(38以降)
※上手く表示されない … Firefox(37以前)
XHTML1.1でのグループルビ:新垣結衣あらがきゆい:熟語にひとまとめにルビ。
<ruby><rb>新垣結衣</rb><rt>あらがきゆい</rt></ruby>
※適切に表示 … Internet Explorer,Chrome,Safari,Opera,Firefox(38以降)
※上手く表示されない … Firefox(37以前)
XHTML1.1でのモノルビ:のぞみ:文字ごとにルビ。
<ruby><rbc><rb>佐</rb><rb>々</rb><rb>木</rb><rb>希</rb></rbc><rtc><rt>さ</rt><rt>さ</rt><rt>き</rt><rt>のぞみ</rt></rtc></ruby>
※適切に表示 …
※上手く表示されない … Internet Explorer,Chrome,Safari,Opera,Firefox

「両面ルビ」は現在のところ、全滅です。

HTML5形式の両面ルビ:新垣結衣あらがきゆいガッキー:グループ + グループ。
<ruby><rb>新垣結衣</rb><rtc><rt>あらがきゆい</rt></rtc><rtc><rt>ガッキー</rt></ruby>
HTML5形式の両面ルビ:のぞみのぞみん:モノ + グループ。
<ruby><rb>佐</rb><rb>々</rb><rb>木</rb><rb>希</rb><rtc><rt>さ</rt><rt>さ</rt><rt>き</rt><rt>のぞみ</rt></rtc><rtc>のぞみん</rtc></ruby>
HTML5形式の両面ルビ:あらがき:モノルビ + モノルビ。
<ruby><rb>新</rb><rb>垣</rb><rb>結</rb><rb>衣</rb><rt>あら</rt><rt>がき</rt><rt>ゆ</rt><rt>い</rt><rtc><rt>ガ</rt><rt>ッ</rt><rt>キ</rt><rt>ー</rt></rtc></ruby>
XHTML1.1での両面ルビ:新垣結衣あらがきゆいガッキー:グループ + グループ。
<ruby><rbc><rb>新垣結衣</rb></rbc><rtc><rt>あらがきゆい</rt></rtc><rtc><rt>ガッキー</rt></rtc></ruby>
XHTML1.1での両面ルビ:のぞみ:モノルビ + モノルビ。
<ruby><rbc><rb>佐</rb><rb>々</rb><rb>木</rb><rb>希</rb></rbc><rtc><rt>さ</rt><rt>さ</rt><rt>き</rt><rt>のぞみ</rt></rtc><rtc><rt>の</rt><rt>ぞ</rt><rt>み</rt><rt>ん</rt></rtc></ruby>
※適切に表示 …
※上手く表示されない … Internet Explorer,Chrome,Safari,Opera,Firefox

ruby_enabler2.js を利用すれば、適切なルビ表示が行えます。こちらのページでご確認ください。