ルビと下線と圏点の調整

ルビと下線と、加えて圏点との位置などを満足できるように調整できるかの確認。今のCSSでどこまでコントロールできるかを確認する。

調整

選択肢を選んだり数値を変えて、ルビと下線と圏点の位置などを調整する。

下線の位置: （CSSのtext-underline-positionプロパティ）

下線の既定の位置からのオフセット: ピクセル（text-underline-offset）

ルビテキストの既定の位置からのオフセット: ピクセル（rtのpositionがrelativeに設定してあり、inset-block-startで調整。増やすと本体に近づき、減らすと本体から遠ざかる。）

ルビの背景色: （background-color）

行間: em（line-height、行ボックスの高さ）

下線

あああああああ強調のみああああああああ。ああああああああああ。ああああ強調が(きょうちょうが)広い(ひろい)ああああああああああ。あああああああ強調のみああああああああ。ああああああああああ。ああああ離れたルビ(はなれたるび)を囲む一つの強調(きょうちょう)ああああああああああ

あああああああああああああああああああああ。ああああああああああ。強調と(きょうちょうと)ルビ(るび)ああああ

あああああああああああああああああああああ。ああああああああああ。ルビOnly(るびのみ)強調とルビ(きょうちょうとるび)ああああ

あああああああああああああああああああああ。ああああああああああ。強調と(きょうちょうと)ルビ(るび)ああああ

あああああああああああああああああああああ。ああああああああああ。ルビOnly(るびのみ)強調とルビ(きょうちょうとるび)ああああ

圏点

あああああああああああああああああああああ。ああああああああああ。強調と(きょうちょうと)ルビ(るび)ああああ

あああああああああああああああああああああ。ああああああああああ。ルビOnly(るびのみ)強調とルビ(きょうちょうとるび)ああああ

あああああああああああああああああああああ。ああああああああああ。強調と(きょうちょうと)ルビ(るび)ああああ

あああああああああああああああああああああ。ああああああああああ。ルビOnly(るびのみ)強調とルビ(きょうちょうとるび)ああああ