Flexbox 演练场
flex-direction
justify-content
align-items
flex-wrap
gap
元素数量（1–8）
4 个元素
1
2
3
4
.container {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: stretch;
flex-wrap: nowrap;
gap: 0;
}
Flex元素属性
| 属性 | 值 | 描述 |
|---|---|---|
| flex-grow | 0, 1, 2… | 相对其他元素的增长比例 |
| flex-shrink | 0, 1, 2… | 空间不足时的收缩比例 |
| flex-basis | auto, 0, 200px… | 增长/收缩前的初始尺寸 |
| flex | 1 = 1 1 0% | grow、shrink、basis的简写 |
| align-self | auto, flex-start… | 覆盖该元素的align-items设置 |
| order | 0, 1, -1… | 视觉顺序（默认0） |