CSS flex:1
在 CSS 中,flex: 1
是一个用于弹性布局(Flexbox)的简写属性,主要用于控制 flex 项目(子元素)如何分配父容器的剩余空间。以下是其核心作用和用法:
核心作用
- 等分剩余空间:让 flex 项目自动填充父容器的剩余空间,所有设置了
flex: 1
的项目会平均分配可用空间。 - 弹性伸缩:使项目能够根据父容器的大小自动伸缩,适应不同屏幕尺寸。
- 简化布局:避免手动计算宽度或高度,快速实现等高列、等分布局等。
在 CSS 中,flex: 1
是一个用于弹性布局(Flexbox)的简写属性,主要用于控制 flex 项目(子元素)如何分配父容器的剩余空间。以下是其核心作用和用法:
flex: 1
的项目会平均分配可用空间。