CSS的flex属性是flex-grow、flex-shrink和flex-basis这三个属性的组合。
-
flex-grow:指定弹性盒子的伸展比例,默认值为0。如果所有弹性盒子的flex-grow属性都为0,则它们将等分剩余空间。如果一个弹性盒子的flex-grow属性为1,而其他弹性盒子的flex-grow属性为0,则前者将占据剩余空间的全部。
-
flex-shrink:指定弹性盒子的收缩比例,默认值为1。如果空间不足,弹性盒子将按照flex-shrink属性的比例进行收缩。如果所有弹性盒子的flex-shrink属性都为1,则它们将等比例收缩。
-
flex-basis:指定弹性盒子在主轴上的初始大小,默认值为auto。可以设置为具体的长度值或百分比,也可以设置为content、fit-content、min-content、max-content等特殊值。