flex布局中flex:1和flex:auto的区别

在flex:1 时在尺寸不足时会优先最小化尺寸,flex:auto在尺寸不足时优先最大化内容尺寸。

效果如下所示:

flex布局中flex:1和flex:auto的区别_第1张图片

flex:1 的尺寸是较长的尺寸优先牺牲自己的尺寸,而flex:auto 中是较长的尺寸优先扩展自己的尺寸。

所以,flex:1 更适合在等比例列表时使用,flex:auto适用于元素充分利用剩余空间,比如头部导航文字多少不一致时使用

你可能感兴趣的:(css,css)