flex布局属性有哪些

Flex布局属性有以下几种：
1. flex-direction：设置主轴的方向，可以是row（水平方向，默认值）、column（垂直方向）、row-reverse（水平方向，反向排列）或column-reverse（垂直方向，反向排列）。
2. flex-wrap：设置是否换行，可以是nowrap（不换行，默认值）、wrap（换行）或wrap-reverse（换行，反向排列）。
3. flex-flow：是flex-direction和flex-wrap的简写形式，可以同时设置主轴方向和是否换行。
4. justify-content：设置主轴上的对齐方式，可以是flex-start（默认值，左对齐）、flex-end（右对齐）、center（居中对齐）、space-between（两端对齐，项目之间的间隔相等）、space-around（每个项目两侧的间隔相等，项目之间的间隔是相邻项目间隔的一半）或space-evenly（每个项目间隔相等）。
5. align-items：设置交叉轴上的对齐方式，可以是flex-start（顶部对齐）、flex-end（底部对齐）、center（居中对齐）、baseline（基线对齐，项目的第一行文字的基线对齐）或stretch（默认值，项目拉伸填满整个交叉轴）。
6. align-content：设置多根轴线的对齐方式，只有一根轴线时不起作用，可以是flex-start（顶部对齐）、flex-end（底部对齐）、center（居中对齐）、space-between（两端对齐，轴线之间的间隔相等）、space-around（每根轴线两侧的间隔相等，轴线之间的间隔是相邻轴线间隔的一半）或stretch（默认值，轴线拉伸填满整个交叉轴）。
7. order：设置项目的排列顺序，默认为0，数值越小，排列越靠前。
8. flex-grow：设置项目的放大比例，默认为0，即不放大。
9. flex-shrink：设置项目的缩小比例，默认为1，即如果空间不足，项目将缩小。
10. flex-basis：设置项目在主轴上的初始大小，默认为auto，可以是具体的长度值或百分比。
11. flex：是flex-grow、flex-shrink和flex-basis的简写形式，可以同时设置项目的放大比例、缩小比例和初始大小。
12. align-self：设置单个项目在交叉轴上的对齐方式，可以覆盖align-items属性，可以是auto（默认值，继承父元素的align-items属性）、flex-start（顶部对齐）、flex-end（底部对齐）、center（居中对齐）、baseline（基线对齐）或stretch（拉伸填满整个交叉轴）。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！