ウェブでは主に文字は横書きが主流です。
横書きのときのふりがなのコーディングは別ページに記載しています。
猫
を
描
く
ですが、日本語は縦書きで作文を習い、小説も新聞も縦書きです。
縦書きの文字に対してふりがなをつけるには、やや面倒なのでメモをしておきます。
猫
を
描
く
CSSは以下のように書きます。
.demo_tategaki2{
writing-mode: vertical-rl;
ruby-position : over;
}
.demo_tategaki2 ruby {
writing-mode:vertical-rl
}
HTMLはこちら
<div class="demo_tategaki2">
<ruby>
猫<rt>ねこ</rt>
</ruby>
を
<ruby>
描<rt>えが</rt>
</ruby>
く
</div>