css box-direction 属性指定显示哪个方向的 box 的子元素
默认值: | normal |
---|---|
继承性: | no |
版本: | CSS3 |
JavaScript 语法: | object.style.boxDirection="reverse" |
box-direction: normal|reverse|inherit;
值 | 描述 |
---|---|
normal | 以默认方向显示子元素 |
reverse | 以反方向显示子元素 |
inherit | 应该从子元素继承 box-direction 属性的值 |
目前主流浏览器不支持 box-direction 属性
Internet Explorer 10 通过私有属性 -ms-flex-direction 支持
Firefox通过私有属性 -moz-box-direction 支持
Safari 和 Chrome 通过私有属性 -webkit-box-direction 属性
Internet Explorer 9 及更早 IE 版本不支持弹性框
由右至左,显示一个div box的子元素
div{
width:350px;
height:100px;
border:1px solid black;
/* Internet Explorer 10 */
display:-ms-flexbox;
-ms-flex-direction:row-reverse;
/* Firefox */
display:-moz-box;
-moz-box-direction:reverse;
/* Safari, Opera, and Chrome */
display:-webkit-box;
-webkit-box-direction:reverse;
/* W3C */
display:box;box-direction:reverse;
}