flex-grow

3 位贡献者:

简介

flex-grow CSS属性定义弹性盒子项(flex item)的拉伸因子。

  • 初始值 0
  • 适用元素 flex items, including in-flow pseudo-elements
  • 可继承 no
  • 适用媒体 visual
  • 计算值 as specified
  • 可动画 yes, as a number
  • Canonical order 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的值。

参见

文档标签和贡献者

向此页面作出贡献: fskuok, teoli, Ribery
最后编辑者: fskuok,