项目属性

Flex 容器内的直接子元素称为弹性项目，常用项目属性包括：

1. flex-grow

定义项目的放大比例，默认为 0，不放大。

css

flex-grow: 1;

数值越大，剩余空间分配越多。

定义项目的缩小比例，默认为 1，允许缩小。

css

flex-shrink: 1;

当空间不足时，数值越大，缩小越多。

定义项目在主轴上的初始大小，默认 auto，即项目本来大小。

css

flex-basis: 100px;

可以设定固定尺寸或百分比。

简写属性，结合 flex-grow、flex-shrink 和 flex-basis。

css

flex: 1 1 100px;

控制项目的排列顺序，数字越小越靠前，默认 0。

css

order: 2;

覆盖容器的 align-items，设置单个项目在交叉轴上的对齐方式。

可选值：auto、flex-start、flex-end、center、baseline、stretch。

css

align-self: center;