Flex 布局属性详解：从方向、对齐到伸缩比例

在flex中，常用的属性有：\n\n1. flex-direction：指定flex容器中的子元素排列方向（row、column、row-reverse、column-reverse）\n2. flex-wrap：指定子元素是否换行显示（nowrap、wrap、wrap-reverse）\n3. flex-flow：同时指定flex-direction和flex-wrap的简写方式\n4. justify-content：指定子元素在主轴上的对齐方式（flex-start、flex-end、center、space-between、space-around）\n5. align-items：指定子元素在交叉轴上的对齐方式（flex-start、flex-end、center、baseline、stretch）\n6. align-content：当子元素换行时，指定行与行之间在交叉轴上的对齐方式（flex-start、flex-end、center、space-between、space-around、stretch）\n7. flex：指定子元素的伸缩比例（可以是一个非负数）\n8. order：指定子元素的排列顺序（可以是一个整数，越小越靠前）\n9. align-self：指定单个子元素在交叉轴上的对齐方式（flex-start、flex-end、center、baseline、stretch）