最直接有效的办法是使用 row-gap 控制行间距，它只作用于网格容器的行之间，支持多种单位，设为0可消除空隙，且兼容现代浏览器。
Grid网格布局中行间距太大，最直接有效的办法就是用 row-gap 单独控制行与行之间的间隙，而不影响列间距或元素内部样式。
row-gap 是专治“行距过大”的精准开关
它只作用于网格容器的行之间，和 column-gap 互不干扰。设置后，所有相邻行之间的空白区域会统一按该值计算，不会牵连到单元格内容、padding 或 margin。
- 支持像素（px）、em、rem、百分比等常见单位
- 可以设为 0 来完全消除行间空隙
- 在 Grid 布局启用后（即 display: grid 或 inline-grid），它才生效
别和 margin 或 padding 混着用
很多人发现行距大，第一反应是给子元素加 margin-bottom，结果导致最后一行下方也多出空白，或者响应式时错位。row-gap 才是语义正确、布局干净的解法。
- 子项无需额外设置 margin，避免嵌套干扰
- 换行逻辑由 Grid 自动处理，row-gap 始终对齐行轴方向
- 媒体查询中可单独调整 row-gap，适配不同屏幕
兼容性放心，现代项目基本无压力
chrome 66+、firefox 63+、safari 14.1+、edge 79+ 都原生支持 row-gap。如需兼容老版本 Safari（
- grid-gap: 12px;（已废弃但兼容性更好）
- 或用 gap: 12px;（推荐，现代标准，多数场景够用）
基本上就这些。调行距，认准 row-gap —— 简单、干净、不误伤其他布局。