CSS3

プロパティ

text-orientation

→●、mdn

縦書きにおけるテキストの方位法。

このプロパティは、行の中のテキストの方位を指定する。現時点で効果があるのは、「↑↓」縦書きタイポ グラフィック モードに限られる ─ 「⇔」横書きタイポ グラフィック モードにおけるボックス上では効果はない。

mixed

（混在）。「↑↓」縦組みにおいては、「⇔」横書きのみの用字系に属するタイポ グラフィック文字単位を側転に植字する ─ すなわち、その「⇔」横書きテキストにおける標準の方位から 時計回りに 90°回転される。

「↑↓」縦書き用字系に属するタイポ グラフィック文字単位は、その内在的方位に植字される。

詳細は、「↑↓」縦書きにおける方位を見よ。

これは、「↑↓」縦書きが支配的な用字系によるテキストをレイアウトするための、典型的な値である。

<DIV style="border:1px solid red; width:100px; height:150px;
 writing-mode:vertical-rl;
 text-orientation:mixed;
">abc def あいう
</DIV>

upright

（正立）。「↑↓」縦組みにおいては、「⇔」横書きのみの用字系に属するタイポ グラフィック文字単位を正立に ─ すなわち、それらの標準の「⇔」横書き方位に ─ 植字する。

「↑↓」縦書き用字系に属するタイポ グラフィック文字単位は、それらの内在的方位に植字され、通常どおり形状付けられる。

詳細は、「↑↓」縦書きにおける方位を見よ。

この値は direction の使用値を ltr にする。加えて、双向性による並び替えの目的においては、すべての文字は「→」左から右 strong 文字として扱われるようになる。

注記： 算出値と違って、direction の使用値に波及するのは、この方向上の上書きが適用されない子孫（「⇔」横書き inline-block の内容など）の中へ、rtl を適正に継承できるようにするためである。

<DIV style="border:1px solid red; width:100px; height:150px;
 writing-mode:vertical-rl;
 text-orientation:upright;
">abc def あいう
</DIV>

sideways

（側転）。「↑↓」縦組みにおいては、これは、すべてのテキストを側転に植字する ─ 「⇔」横書きレイアウトの中にあるかのようにしつつ、90°時計回りに回転させたかのように。

<DIV style="border:1px solid red; width:100px; height:150px;
 writing-mode:vertical-rl;
 text-orientation:sideways;
">abc def あいう
</DIV>

例：

text-orientation の値（writing-modeプロパティ は vertical-rl）

注記： このプロパティの値を変更すると、行内レベルの整列に影響し得る。詳細は テキストの基底線 に。

ユーザー エージェントは、後方互換性の理由から必要であれば，値 sideways-right も受容してもよい ― それは、sideways に算出されるとする。

.vertical-upright-hebrew {
  writing-mode: vertical-rl;
  text-orientation: upright;
  unicode-bidi: bidi-override;
  direction: ltr;
}

テスト