Style flexFlow 属性

定义和用法

flexFlow 属性是 flexDirectionflexWrap 属性的简写属性。

flexDirection 属性规定弹性项的方向。

flexWrap 属性规定弹性项目是否应该换行。

注释:如果元素不是弹性项,则 flexFlow 属性无效。

另请参阅:

CSS 参考手册:flex-flow 属性

实例

使弹性项按列显示,并且不换行:

document.getElementById("main").style.flexFlow = "column nowrap";

亲自试一试

语法

返回 flexFlow 属性:

object.style.flexFlow

设置 flexFlow 属性:

object.style.flexFlow = "flex-direction flex-wrap|initial|inherit"

属性值

描述
flex-direction

可能的值:

  • row
  • row-reverse
  • column
  • column-reverse
  • initial
  • inherit

默认值是 "row"。

规定弹性项目的方向。

flex-wrap

可能的值:

  • nowrap
  • wrap
  • wrap-reverse
  • initial
  • inherit

默认值是 "nowrap"。

规定弹性项目是否应该换行。

initial 将此属性设置为其默认值。请参阅 initial
inherit 从其父元素继承此属性。请参阅 inherit

技术细节

默认值: row nowrap
返回值: 字符串,表示元素的 flex-flow 属性
CSS 版本: CSS3

浏览器支持

表中的数字注明了首个完全支持该属性的浏览器版本。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 11.0 支持 9.0 支持

相关页面

HTML DOM STYLE 参考手册:flex 属性

HTML DOM STYLE 参考手册:flexBasis 属性

HTML DOM STYLE 参考手册:flexDirection 属性

HTML DOM STYLE 参考手册:flexGrow 属性

HTML DOM STYLE 参考手册:flexShrink 属性

HTML DOM STYLE 参考手册:flexWrap 属性