简介
flex-grow CSS属性定义弹性盒子项(flex item)的拉伸因子。
| 初始值 | 0 |
|---|---|
| 适用元素 | flex items, including in-flow pseudo-elements |
| 是否是继承属性 | 否 |
| 适用媒体 | visual |
| 计算值 | as specified |
| 是否适用于 CSS 动画 | yes, as a number |
| 正规顺序 | the unique non-ambiguous order defined by the formal grammar |
更多属性和信息请参见使用 CSS flexible boxes。
语法
Formal syntax: <number>
flex-grow: 3 flex-grow: inherit
值
<number>- 参见
<number>。负值无效。
示例
element {
flex-grow: 3;
}
规范
| 规范 | 状态 | 备注 |
|---|---|---|
| CSS Flexible Box Layout Module | Candidate Recommendation |
浏览器兼容性
| Feature | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | 18.0 (18.0) (behind a pref) [1] 20.0 (20.0) |
21.0-webkit | 未实现 | 12.10 | 未实现 |
| Feature | Firefox Mobile (Gecko) | Android | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | ? | ? | 未实现 | 12.10 | 未实现 |
[1] Firefox在Firefox 28以前只支持单行弹性盒。Firefox 18和19的用户需要把about:config的 "layout.css.flexbox.enabled"改为true以启用弹性盒支持。
[2] 在Firefox 32之前, Gecko不能动画过渡始于或止于0的值。