实例
表格中展示了不同的书写模式:
.example.Text1 span, .example.Text1 { writing-mode: horizontal-tb; -webkit-writing-mode: horizontal-tb; -ms-writing-mode: horizontal-tb;} .example.Text2 span, .example.Text2 { writing-mode: vertical-lr; -webkit-writing-mode: vertical-lr; -ms-writing-mode: vertical-lr;} .example.Text3 span, .example.Text3 { writing-mode: vertical-rl; -webkit-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl;} .example.Text4 span, .example.Text4 { writing-mode: sideways-lr; -webkit-writing-mode: sideways-lr; -ms-writing-mode: sideways-lr;} .example.Text5 span, .example.Text5 { writing-mode: sideways-rl; -webkit-writing-mode: sideways-rl; -ms-writing-mode: sideways-rl;}
知识兔 »
知识兔 »
属性定义及使用说明
writing-mode 属性定义了文本在水平或垂直方向上如何排布。
语法格式如下:
writing-mode: horizontal-tb | vertical-rl | vertical-lr | sideways-rl | sideways-lr
- horizontal-tb:水平方向自上而下的书写方式。即 left-right-top-bottom
- vertical-rl:垂直方向自右而左的书写方式。即 top-bottom-right-left
- vertical-lr:垂直方向内内容从上到下,水平方向从左到右
- sideways-rl:内容垂直方向从上到下排列
- sideways-lr:内容垂直方向从下到上排列
浏览器支持
表格中的数字表示支持该属性的第一个浏览器版本号。
属性 | |||||
---|---|---|---|---|---|
writing-mode | 8.0 | 6.0 | 41.0 | 5.1 | 15 |