writing-modeプロパティ
writing-modeプロパティは、ページ上のテキストの縦書きまたは横書きの方向を設定します。値には、horizontal-tb(左から右、上から下への横書き)、vertical-rl(上から下、右から左への縦書き)、vertical-lr(上から下、左から右への縦書き)があります。
構文
セレクタ {
writing-mode: horizontal-tb または vertical-rl または vertical-lr;
}
例
テキストの方向を左から右、上から下の横書きに設定してみましょう:
<p>
Text
</p>
body {
width: 100px;
height: 50px;
}
p {
writing-mode: horizontal-tb;
font-size: 2em;
margin-top: 0;
}
:
例
では、方向を上から下、右から左の縦書きに変更してみましょう:
<p>
Text
</p>
body {
width: 100px;
height: 50px;
}
p {
writing-mode: vertical-rl;
font-size: 2em;
margin-top: 0;
}
:
例
テキストの方向を上から下、左から右の縦書きに設定してみましょう:
<p>
Text
</p>
body {
width: 100px;
height: 50px;
}
p {
writing-mode: vertical-lr;
font-size: 2em;
margin-top: 0;
}
:
関連項目
-
フォントのカーニングを設定する
font-kerningプロパティ -
縦書きテキスト内の文字の向きを設定する
text-orientationプロパティ