CSS 3 box-direction 属性 - CSS 参考手册

CSS box-direction 属性指定显示哪个方向的 box 的子元素

默认值：	normal
继承性：	no
版本：	CSS3
JavaScript 语法：	object.style.boxDirection="reverse"

语法

box-direction: normal|reverse|inherit;

值说明

值	描述
normal	以默认方向显示子元素
reverse	以反方向显示子元素
inherit	应该从子元素继承 box-direction 属性的值

浏览器支持

Internet Explorer Firefox Opera Google Chrome Safari

目前主流浏览器不支持 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;
}

运行范例 »