flex:1

flex: 1 是一种用于设置 flexbox 布局中项目的弹性伸缩比例的属性。

在 flexbox 布局中，父容器（flex container）可以设置 display: flex 或 display: inline-flex 来创建一个弹性容器，其中的子元素（flex items）可以通过 flex 属性来控制它们在父容器中的弹性伸缩行为。

当应用 flex: 1 属性于某个 flex item 时，它表示该元素将会根据可用空间来分配弹性伸缩比例。具体而言，当容器有多余空间时，flex: 1 的元素将会占据剩余空间的比例。如果多个子元素都具有 flex: 1 属性，它们将平均分配可用空间，即每个子元素占据相同的比例。

举个例子，假设一个容器包含了三个子元素，其中两个子元素的 flex 属性设置为 1，而另一个子元素没有设置 flex 属性。那么，前两个子元素将会平均占据剩余空间的一半，而没有设置 flex 属性的子元素则会根据其内容大小进行布局。

总结起来，flex: 1 可以用于创建灵活的布局，让子元素根据可用空间的比例进行伸缩分配。