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 |
浏览器兼容性
加载中…