文字方向 | text-orientation
text-orientation
text-orientation CSS属性定义行内文本字符的方向。此属性仅在垂直模式下有效，即writing-mode不是horizontal-tb。这对控制使用垂直脚本的语言的显示以及制作垂直表头是很有用的。
/* 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: unset;
| Initial value | mixed |
|---|---|
| Applies to | all elements, except table row groups, rows, column groups, and columns |
| Inherited | yes |
| Media | visual |
| Computed value | as specified |
| Animation type | discrete |
| Canonical order | the unique non-ambiguous order defined by the formal grammar |
语法
该text-orientation属性可取值如下：
可能值
mixed——将水平脚本的字符旋转90°。自然地表现垂直脚本的特征。默认值。
形式语法
mixed | upright | sideways
实例
HTML
<p>Lorem ipsum dolet semper quisquam.</p>
CSS
p {
writing-mode: vertical-rl;
text-orientation: upright;
}
结果
规范
| Specification | Status | Comment |
|---|---|---|
| CSS Writing Modes Module Level 3The definition of 'text-orientation' in that specification. | Candidate Recommendation | Initial definition. |
浏览器兼容性
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic support | (Yes) -webkit 48.0 (unprefixed) | 41 (41)1 | No support | (Yes) -webkit | No support |
| sideways | No support | 44 (44)2 | No support | No support | No support |
| Feature | Android | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
| Basic support | No support | 48.0 | 48.0 | 41.0 (41)1 | No support | No support | No support |
| sideways | No support | No support | No support | 44.0 (44)2 | No support | No support | No support |
