CSS进阶（二十四）流向的改变

direction

direction: ltr; // 默认值
direction: rtl; //right to left

direction可以改变替换元素或者 inline-block/ inline-table 元素的水平呈现顺序

应用

（1）相同元素不同设备下的展示顺序

（2）...隐藏字符变成隐藏开头

在不支持 text-align:start/end 的浏览器中（如 IE），direction会改变text-align的默认值，默认是left.采用direction: rtl；变成right

unicode-bidi

unicode-bidi: normal; // 默认值,正常排列
unicode-bidi: embed;//只能作用在内联元素上，字符排序独立内嵌，不受外部影响
unicode-bidi: bidi-override; //“重写双向排序规则”

writing-mode

CSS3 规范属性

IE 私有属性语法

 writing-mode: lr-tb | tb-rl | tb-lr (IE8+);

CSS3 规范

writing-mode: horizontal-tb | vertical-rl | vertical-lr;

应用

（1）使用margin:auto或text-algin实现垂直居中效果

（2）实现点击按钮单个文字下沉效果

 

转载于:https://www.cnblogs.com/goOtter/p/9825871.html