JavaScript HTML DOM Style flexDirection 属性

  • flexDirection 属性

    flexDirection属性设置或返回flex项的方向。
    注意:如果元素不是flex项,则flexDirection属性不起作用。
    重新排列<div>元素内flex项目的方向:
    document.getElementById("main").style.flexDirection = "column-reverse";
    尝试一下
  • 浏览器支持

    IE/Edge Chrome FireFox Safari Opera
    属性
    flexDirection
    11.0+
    支持
    支持
    6.1 WebkitflexDirection
    支持
  • 语法

    返回flexDirection属性:
    object.style.flexDirection
    设置flexDirection属性:
    object.style.flexDirection = "row|row-reverse|column|column-reverse|initial|inherit"
  • 属性值

    描述
    row 默认值。 灵活项目水平显示为一行
    row-reverse 与row相同,但顺序相反
    column 灵活项目作为列垂直显示
    column-reverse 与column相同,但顺序相反
    initial 设置这个属性为默认值。 阅读有关initial信息
    inherit 从其父元素继承此属性。 阅读有关inherit的信息
  • 技术细节

    项目 描述
    默认值: row
    返回值: 一个字符串,表示元素的flex-direction属性
    CSS版本 CSS3
  • 相关页面

    CSS参考:flex-basis 属性