父元素设置flex:column后，子元素height无效
我想得到下图效果，于是设置容器的flex：column,子元素1设置height:30px;子元素2设置flex:1; overflow-y:auto;但是子元素1的高度怎么都不生效，发现是被 flex-shrink影响了。于是我将子元素1的flex-shrink设置为0，不被缩小。它就乖乖的显示我设置的高度了。flex-shrink介绍flex-shrink属性定义了项目的缩小比例...
·
我想得到下图效果，于是设置
容器的flex：column,
子元素1设置height:30px;
子元素2设置flex:1; overflow-y:auto;
但是子元素1的高度怎么都不生效，发现是被 flex-shrink影响了。于是我将子元素1的flex-shrink设置为0，不被缩小。它就乖乖的显示我设置的高度了。
flex-shrink介绍
flex-shrink属性定义了项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。
如果所有项目的flex-shrink属性都为1，当空间不足时，都将等比例缩小。如果一个项目的flex-shrink属性为0，其他项目都为1，则空间不足时，前者不缩小。
负值对该属性无效。
权威｜前沿｜技术｜干货｜国内首个API全生命周期开发者社区
更多推荐
2
0- 0
已为社区贡献1条内容
所有评论(0)