CSS 3 box-direction 属性
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;
}本文内容仅供个人学习/研究/参考使用，不构成任何决策建议或专业指导。分享/转载时请标明原文来源，同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦～感谢您的理解与支持！