display:flex换行之后的样式修改

当 `display:flex` 容器中的子元素超出容的宽度时，子元素会自动换行并重新排列。在这种情况下，您可以使用以下 CSS 属性来修改子元素的样式：

1. `flex-wrap` 属性可以控制子元素的换行方式默认情况下，`flex-wrap` 属性的值为 `nowrap`，表示子元素不换行。如果将 `flex-wrap` 设置为 `wrap`，则子元素会在容器宽度不足时换行。

2. `justify-content` 属性可以控制子元素在主轴方向上的对齐方式。默认情况下，子元素会在主轴方向上平均分布。如果您希望子元素向左对齐，可以将 `justify-content` 设置为 `flex-start`；如果您希望子元素向右对齐，可以将 `justify-content` 设置为 `flex-end`。

3. `align-items` 属性可以控制子元素在交叉轴方向上的对齐方式。默认情况下，子元素会在交叉轴方向上居中对齐。如果您希望子元素向上对齐，可以将 `align-items` 设置为 `flex-start`；如果您希望子元素向下对齐，可以将 `align-items` 设置为 `flex-end`。

4. `flex-basis` 属性可以控制子元素在其所在行或列中占据的空间大小。默认情况下，子元素会占据相等的空间大小。如果您希望某个子元素占据更多的空间，可以将其 `flex-basis` 属性设置为一个较大的值。如果您希望某个子元素占据更少的空间，可以将其 `flex-basis` 属性设置为一个较小的值。

5. `flex-grow` 和 `flex-shrink` 属性可以控制子元素在空间不足时的增长和缩小比例。默认情况下，子元素的 `flex-grow` 和 `flex-shrink` 属性的值均为 1，表示它们会平均增长和缩小。如果您希望某个子元素在空间不足时优先增长，可以将其 `flex-grow` 属性设置为一个较大的值；如果您希望某个子元素在空间不足时优先缩小，可以将其 `flex-shrink` 属性设置为一个较大的值。