文字（コンテンツ）の流れる方向

文字（コンテンツ）の流れる方向を変更するには、writing-modeプロパティを使用します。

• ※ IEは独自実装で指定する値が異なります。詳しくは以下MSDNの仕様ページをご確認ください。
  MSDN writing-mode

【構文】

							writing-mode:方向;
						

指定可能な値（方向）

値	説明	初期値
horizontal-tb	文字（コンテンツ）の基本的な流れは左から右となる 水平方向は左から右へ、垂直方向は上から下へ、行は下へ流れる	○
vertical-rl	文字（コンテンツ）の基本的な流れは右から左となる 水平方向は右から左へ、垂直方向は上から下へ、行は左へ流れる	-
vertical-lr	文字（コンテンツ）の基本的な流れは左から右となる 水平方向は左から右へ、垂直方向は上から下へ、行は右へ流れる	-

サンプル

horizontal-tb

vertical-rl

vertical-lr

/* horizontal-tb */ p.sample { -webkit-writing-mode:horizontal-tb; writing-mode:horizontal-tb; } /* vertical-rl */ p.sample { -webkit-writing-mode:vertical-rl; writing-mode:vertical-rl; } /* vertical-lr */ p.sample { -webkit-writing-mode:vertical-lr; writing-mode:vertical-lr; }