flex布局有哪些常用属性？

flex布局是一种用于页面布局的CSS3新特性，它可以让容器中的子元素自适应空间、自动调整布局。以下是flex布局中一些常用的属性：

1. flex-direction: 设置主轴的方向（row、row-reverse、column、column-reverse）；
2. justify-content: 设置主轴上子元素的对齐方式（flex-start、flex-end、center、space-between、space-around）；
3. align-items: 设置交叉轴上子元素的对齐方式（flex-start、flex-end、center、baseline、stretch）；
4. flex-wrap: 设置子元素在一行或一列中是否换行（nowrap、wrap、wrap-reverse）；
5. align-content: 当有多行时，设置各行在交叉轴上的对齐方式（flex-start、flex-end、center、space-between、space-around、stretch）；
6. flex-grow: 设置子元素在分配剩余空间时所占据的比例；
7. flex-shrink: 设置子元素在空间不足时所占据的比例；
8. flex-basis: 设置子元素在分配剩余空间之前的初始大小。

相关问题

flex布局有哪些常用属性

flex布局有以下常用属性：

1. `display`: 设置容器为flex布局，取值为`flex`。

2. `flex-direction`: 设置主轴方向，取值为`row`（默认）、`row-reverse`、`column`、`column-reverse`。

3. `justify-content`: 设置主轴上的对齐方式，取值为`flex-start`（默认）、`flex-end`、`center`、`space-between`、`space-around`、`space-evenly`。

4. `align-items`: 设置交叉轴上的对齐方式，取值为`stretch`（默认）、`flex-start`、`flex-end`、`center`、`baseline`。

5. `align-content`: 设置多根轴线的对齐方式，取值为`stretch`（默认）、`flex-start`、`flex-end`、`center`、`space-between`、`space-around`。

6. `flex-wrap`: 设置是否换行，取值为`nowrap`（默认）、`wrap`、`wrap-reverse`。

7. `flex-flow`: `flex-direction`和`flex-wrap`的缩写，中间用空格隔开。

8. `order`: 设置元素的排列顺序，数值越小越靠前，默认为0。

9. `flex-grow`: 设置元素在剩余空间中所占比例，数值越大所占比例越多，默认为0。

10. `flex-shrink`: 设置元素的收缩比例，数值越大收缩越快，默认为1。

11. `flex-basis`: 设置元素的基准值，即在分配多余空间之前，元素占据的空间，默认值为`auto`。

12. `flex`: `flex-grow`、`flex-shrink`、`flex-basis`的缩写，中间用空格隔开。

displayflex有哪些常用属性？

display:flex是CSS中用于创建弹性布局的属性。它有以下常用属性：

1. flex-direction：指定主轴的方向，可以是row（水平方向）、column（垂直方向）、row-reverse（水平方向反转）或column-reverse（垂直方向反转）。
2. flex-wrap：指定是否换行，可以是nowrap（不换行）、wrap（换行）或wrap-reverse（反向换行）。
3. justify-content：指定主轴上的对齐方式，可以是flex-start（靠左对齐）、flex-end（靠右对齐）、center（居中对齐）、space-between（两端对齐，项目之间间隔相等）或space-around（每个项目两侧的间隔相等）。
4. align-items：指定交叉轴上的对齐方式，可以是flex-start（靠上对齐）、flex-end（靠下对齐）、center（居中对齐）、baseline（基线对齐）或stretch（拉伸填充）。
5. align-content：指定多行的对齐方式，可以是flex-start（靠上对齐）、flex-end（靠下对齐）、center（居中对齐）、space-between（两端对齐，行之间间隔相等）或space-around（每行两侧的间隔相等）。

这些属性可以通过设置父元素的display:flex来创建弹性布局，并通过设置子元素的属性来控制布局的方式和对齐方式。