例
重新排列内的柔性物品的方向<div>元素：
document.getElementById("main").style.flexDirection = "column-reverse"; 试一试» 定义和用法
该flexDirection属性设置或返回的灵活的项目的方向。
Note:如果元素不是一个灵活的项目，该flexDirection属性没有任何效果。
浏览器支持
该flexDirection属性在IE10 +，Firefox，歌剧，和Chrome支持。
注：Safari浏览器6.1以上支持的替代方案，WebkitFlexDirection财产。
句法
返回flexDirection属性：
object .style.flexDirection设置flexDirection属性：
object .style.flexDirection="row|row-reverse|column|column-reverse|initial|inherit"
属性值
| 值 | 描述 |
|---|---|
| row | 默认值。 灵活的项目以水平方式显示，作为行 |
| row-reverse | 同列，但以相反的顺序 |
| column | 柔性物品被垂直显示，作为柱 |
| column-reverse | 同列，但以相反的顺序 |
| initial | 将此属性设置为默认值。 阅读关于初始 |
| inherit | 继承其父元素此属性。 阅读关于继承 |
技术细节
| 默认值： | 行 |
|---|---|
| 返回值： | 一个字符串，表示元件的弯曲方向属性 |
| CSS版本 | CSS3 |
相关页面
CSS参考： flex-direction property
HTML DOM样式的引用： flex property
HTML DOM样式的引用： flexBasis property
HTML DOM样式的引用： flexFlow property
HTML DOM样式的引用： flexGrow property
HTML DOM样式的引用： flexShrink property
HTML DOM样式的引用： flexWrap property
<Style对象