Hisia ya CSS flex-grow

定义和用法

flex-grow 属性规定在相同的容器中,项目相对于其余弹性项目的增长量。

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

另请参阅:

CSS 教程: CSS 弹性框

CSS 参考手册:flex 属性

CSS 参考手册:flex-basis 属性

CSS 参考手册:flex-direction 属性

CSS 参考手册:flex-flow 属性

CSS 参考手册:flex-shrink 属性

CSS 参考手册:flex-wrap 属性

HTML DOM 参考手册:flexGrow 属性

实例

让第二个弹性项目的宽度成为其余弹性项目的三倍:

div:nth-of-type(1) {flex-grow: 1;}
div:nth-of-type(2) {flex-grow: 3;}
div:nth-of-type(3) {flex-grow: 1;}

Tafadhali jaribu:

Inayohusiana na lugha ya CSS

flex-grow: number|initial|inherit;

Wakati wa kifaa

Wakati Maelezo
number Wakati wa namba, inasababisha inayofikia kwa kifaa cha kina kwa sababu ya kufaa cha kina cha kina. Chaguo cha kawaida ni 0.
initial Kuweka kifaa hiki kwa chaguo cha kuzingatia cha kawaida. Tazama: initial.
inherit Kuweka kifaa hiki kwa chaguo cha kuzingatia kwa sababu ya kufaa cha kuzingatia kutoka kwa kifaa cha baba. Tazama: inherit.

Mafanikio ya vifaa vya teknolojia

Chaguo cha kuzingatia: 0
Kupatikana: Hakuna
Aniamisheni za kufanya: Inafaa kuona:Mafanikio ya aniamisheni.
Muundo: CSS3
Inayohusiana na lugha ya JavaScript: object.style.flexGrow="5"

Kampuni za kifaa cha kompyuta

Namba za jingwa katika tablica inaeleza na kufungua kwa sababu ya kufaa kwa kiwango cha kwanza cha kifaa cha kila taratibu.

Tafadhali kuingia na namba za kifaa cha kiwango cha kwanza kwa sababu ya kufungua kwa nafasi ya -webkit-、-ms- au -moz-.

Chrome IE / Edge Firefox Safari Opera
29.0
21.0 -webkit-
11.0 28.0
18.0 -moz-
9.0
6.1 -webkit-
17.0