flex-flow
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年9月.
CSS flex-flow 属性是 flex-direction 和 flex-wrap 的简写。
| 初始值 | 该简写所对应的每个属性：
|
|---|---|
| 适用元素 | 弹性容器 |
| 是否是继承属性 | 否 |
| 计算值 | 该简写所对应的每个属性：
|
| 动画类型 | 该简写所对应的每个属性：
|
更多信息参见 使用 CSS 弹性盒
语法
css
/* flex-flow：<'flex-direction'> */ flex-flow: row; flex-flow: row-reverse; flex-flow: column; flex-flow: column-reverse; /* flex-flow：<'flex-wrap'> */ flex-flow: nowrap; flex-flow: wrap; flex-flow: wrap-reverse; /* flex-flow：<'flex-direction'> 和 <'flex-wrap'> */ flex-flow: row nowrap; flex-flow: column wrap; flex-flow: column-reverse wrap-reverse; /* 全局值 */ flex-flow: inherit; flex-flow: initial; flex-flow: revert; flex-flow: revert-layer; flex-flow: unset; 取值
更多取值信息请查看 flex-direction 和 flex-wrap
示例
css
element { /* Main-axis is the block direction with reversed main-start and main-end. Flex items are laid out in multiple lines */ flex-flow: column-reverse wrap; } 规范
| Specification |
|---|
| CSS Flexible Box Layout Module Level 1 # flex-flow-property |