text-orientation
text-orientation CSS 屬性設定一行中文字字元的方向。它隻影響垂直模式下的文字（當 writing-mode 不是 horizontal-tb 時）。它對於控制使用垂直書寫語言的顯示以及製作垂直表格標題非常有用。
試一試
writing-mode: vertical-rl;
text-orientation: mixed;
writing-mode: vertical-rl;
text-orientation: upright;
<section class="default-example" id="default-example">
<div class="transition-all" id="example-element">
<p>
In another moment down went Alice after it, never once considering how in
the world she was to get out again.
</p>
</div>
</section>
語法
css
/* Keyword values */
text-orientation: mixed;
text-orientation: upright;
text-orientation: sideways-right;
text-orientation: sideways;
text-orientation: use-glyph-orientation;
/* Global values */
text-orientation: inherit;
text-orientation: initial;
text-orientation: revert;
text-orientation: revert-layer;
text-orientation: unset;
text-orientation 屬性指定為以下列表中的單個關鍵字。
值
mixed-
將水平書寫指令碼的字元順時針旋轉 90°。自然地排布垂直書寫指令碼的字元。預設值。
upright-
自然地（直立）排布水平書寫指令碼的字元以及垂直書寫指令碼的字形。請注意，此關鍵字會導致所有字元都被視為從左到右：
direction的使用值被強制為ltr。 sideways-
使字元像水平排布一樣，但整行順時針旋轉 90°。
sideways-right-
sideways的別名，為相容性而保留。 use-glyph-orientation-
在 SVG 元素上，此關鍵字導致使用已棄用的 SVG 屬性
glyph-orientation-vertical和glyph-orientation-horizontal的值。
正式定義
正式語法
text-orientation =
mixed |
upright |
sideways
示例
HTML
html
<p>Lorem ipsum dolet semper quisquam.</p>
CSS
css
p {
writing-mode: vertical-rl;
text-orientation: upright;
}
結果
規範
| 規範 |
|---|
| CSS Writing Modes Level 4 # text-orientation |
瀏覽器相容性
載入中…