こんにちは。
シーサイドレーベルweb担当の飯野です。
テキスト文章にふりがな（よみがな）を
振りたい場合があると思います。
そんな時は「ruby 要素」を用いることで
文章にふりがな（よみがな）を振ることが
出来ます。
一番シンプルで簡単な方法を
今回はご紹介させて頂きます。
ブラウザのバージョンなどによっては
もしかしたらうまく表示されない事もあるかもしれません。
単語ごとに ruby要素でマークアップし、
rt要素要素でルビを振る形になります。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<html> <head> <style type="text/css"> <!-- p{font-size:24px;} --> </style> </head> <body> <p><ruby>紫陽花<rt>あじさい</rt></ruby></p> <p><ruby>梅雨<rt>つゆ</rt></ruby></p> <p><ruby>蝸牛<rt>かたつむり</rt></ruby></p> <p><ruby>漢<rt>かん</rt>字<rt>じ</ruby>に<ruby>読み仮名<rt>よみがな</rt></ruby>を<ruby>振<rt>ふ</ruby>る</p> </body> </html> |
上記の様にマークアップすると
この様に表示することが出来ます。
単語にルビを振るだけなら本当に簡単ですよね。
|
1 |
<p><ruby>漢<rt>かん</rt>字<rt>じ</ruby>に<ruby>読み仮名<rt>よみがな</rt></ruby>を<ruby>振<rt>ふ</ruby>る</p> |
文章にルビを振る場合は、一番最後の例の様に
単語ごとに設定していく形です。
そんなに多用することはないかもしれませんが、
知っていると便利な方法だと思いますので
是非試してみて下さいね。
では、また来週お会いしましょう。
●３年ぶりに帰ってきた「藤田哲也の個別コンサルティング」
