`flex-grow：0`如何被解释？

Question

我想知道Flexbox模型中的flex-grow:0是否意味着

• width:0 或
• “成长= 0”

如果它意味着后者，是否可以说它等于width:auto和display:inline-block，即它需要显示所需的宽度？

Answer 1

flex-grow:0只是意味着在项目大小计算期间不会调整项目的大小以适应Flex容器的完整主轴大小。

Specification将其描述为：

  

此<number>组件设置flex-grow，并指定弹性增长系数，该系数确定当正空闲空间为0时，弹性项目相对于弹性容器中其他弹性项目的增长量。分散式。省略时，它设置为1。

我强调主轴尺寸以上你应该知道flex-grow与flex容器的主轴有关，可以是宽度或高度尺寸，具体取决于{{ 1}}并编写用户浏览器的方向性。

因此，我们不能假设与您的假设相等。

但是，当我们谈论flex-direction并编写方向性LRTB（从左到右，从上到下）时，它们的确以与flex-direction: row类似的方式工作。项目显示为内联，但它们仍然不会呈现相同的内容，因为HTML源代码中的每个换行符都没有添加空格，正如我们通常使用常用内联元素看到的那样。

width: auto;怎么样？

Flex项宽度与width: 0属性相关联，而不是与增长因子相关联。虽然在定义增长和收缩因子且非零时，弹性属性优先于flex-basis或width项。