答案：推荐使用gap属性控制flex换行间距，现代浏览器支持下简洁有效；若需兼容旧版本，则通过子元素margin配合父容器负margin抵消多余间隙，避免最后一行空白；注意flex换行的独立行特性及align-content适用于分布而非精确间距。
在使用 CSS Flex 布局时，当子元素换行后，想要控制行与行之间的间距，不能直接依赖 gap 属性（虽然现代浏览器已支持），但更常见的是通过其他方式实现。以下是几种实用的方法来控制 flex 容器中子元素换行后的行间距。
1. 使用 gap 属性（推荐，现代浏览器支持）
如果目标浏览器支持 gap，这是最简单的方式。gap 可同时控制主轴和交叉轴的间距。
示例：.container {
display: flex;
flex-wrap: wrap;
gap: 10px 15px; /* 行间距 10px，列间距 15px */
}
.item {
flex: 0 0 200px;
}这种方式简洁直观，无需额外的 margin 计算，强烈建议在支持的项目中使用。
2. 使用 margin 控制间距
当不使用 gap 或需要兼容旧浏览器时，可通过设置子元素的 margin 来实现间距控制。但要注意换行后可能出现底部间距不一致的问题。
立即学习“前端免费学习笔记（深入）”；
常见做法：- 给每个子元素设置下边距和右边距
- 通过父容器设置负 margin 抵消多余的间距
.container {
display: flex;
flex-wrap: wrap;
margin-bottom: -10px; /* 抵消下边距 */
margin-right: -15px;
}
.item {
flex: 0 0 200px;
margin-right: 15px;
margin-bottom: 10px;
}这种方法兼容性好，适用于大多数场景。
3. 避免最后一行多余间距
使用 margin 方法时，容易出现最后一行下方多出空白的问题。除了用负 margin 抵消外，还可以考虑以下优化：
- 确保容器高度不受影响时，可对最后一行元素使用 :nth-child 计算并移除 margin-bottom
- 或采用 padding + box-sizing 辅助布局
但实际开发中，负 margin 方式更稳定且易于维护。
4. 注意 flex 换行的排列逻辑
flex 换行是按行“从左到右、从上到下”排列的。每行作为一个弹性行，行间没有内置间距控制机制。因此所有间距必须由子元素自身或容器辅助实现。
若使用 align-content: space-between / space-around，会影响行与行之间的对齐方式，但不能精确控制像素间距，适合分布式布局而非固定间距需求。
基本上就这些方法。优先使用 gap，否则用 margin 配合负值调整。关键是理解 flex 换行后每一行的独立性，以及 margin 如何叠加。不复杂但容易忽略细节。
