top

使用writing-mode让文字竖向排版

2017年08月14日

Home > learn > 使用writing-mode让文字竖向排版

writing-mode

 

在很长一段时间里,FireFox, Chrome这些现代浏览器都不支持writing-modewriting-mode基本上只有ie支持,而ie的使用率很低,所以writing-mode长久被弃用。

如今各大浏览器(比如谷歌和火狐)都对writing-mode实现了支持,所以现在writing-mode的兼容性已经不成问题了,该属性强大的功能终于可以大白于天下。

 

writing-mode的用处

 

writing-mode可以控制文本布局,而在中国日本等国家,垂直的文字排版经常可见,比如古诗词。

writing-mode可以实现文字竖向排版。

 

writing-mode的语法

 

/* Keyword values */
writing-mode: horizontal-tb;
writing-mode: vertical-rl;
writing-mode: vertical-lr;

 

/* Global values */
writing-mode: inherit;
writing-mode: initial;
writing-mode: unset;

 

writing-mode属性值:

 

horizontal-tb
文字从左到右排列,换行内容是从上往下扩展。

vertical-rl
文字从上到下排列,换行内容是从右往左扩展。

vertical-lr
文字从上到下排列,换行内容从左往右扩展。

sideways-rl
是正常的文字内容逆时针旋转90度得到的效果。

sideways-lr
是正常的文本内容顺时针旋转90度得到的效果。

标签:

上一篇:

下一篇: