• RSS

[HTML]ルビ(ふりがな)を振る方法

  • このエントリーをはてなブックマークに追加
  • follow us in feedly


HTMLで漢字の上に小さくひらがなでルビを振る方法のご紹介です。

ルビをふるにはrubyタグを使う

ルビをふる対象(ルビベース)の漢字を<ruby></ruby>タグで囲み、ふりがな(ルビテキスト)については<rt></rt>タグを使います。


rubyタグの使い方-その①

まず最初に、漢字1文字ずつにルビをふる場合の記述方法と表示例です。

はんにゃしんぎょう

rubyタグの使い方-その②

次に、漢字ひとかたまりに対してルビをふる方法は以下の通りです。

摩訶般若波羅蜜多心経まかはんにゃはらみたしんぎょう

rubyタグの使い方-その③

②と概ね同じですが、単語ごとにルビを振ることもできます。

摩訶般若まかはんにゃ羅蜜多心経はらみたしんぎょう

rubyタグの使い方-その④

<ruby>に対応していないブラウザでは、<rp></rp>タグで指定した記号(以下の例であればカッコ)でルビテキストを表示します。

摩訶般若波羅蜜多心経(まかはんにゃはらみたしんぎょう)

rubyタグの使い方-まとめ

rubyルビを振る対象の文字列
rbルビベース(省略可)
rtルビテキスト(ふりがな)
rpタグ非対応のブウウザ向け



  • このエントリーをはてなブックマークに追加
  • follow us in feedly

コメント

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください