CSS Grid 网格布局教程(3容器属性:定义行和列的间距)
3.3 grid-row-gap 属性，grid-column-gap 属性，grid-gap 属性grid-row-gap属性设置行与行的间隔（行间距），grid-column-gap属性设置列与列的间隔（列间距）。
.container {
grid-row-gap: 20px;
grid-column-gap: 20px;
}
上面代码中，grid-row-gap用于设置行间距，grid-column-gap用于设置列间距。
grid-gap属性是grid-column-gap和grid-row-gap的合并简写形式，语法如下。
grid-gap: <grid-row-gap 行间距> <grid-column-gap 列间距>;
因此，上面一段 CSS 代码等同于下面的代码。
.container {
grid-gap: 20px 20px;
}
如果grid-gap省略了第二个值，浏览器认为第二个值等于第一个值。
根据最新标准，上面三个属性名的grid-前缀已经删除，grid-column-gap和grid-row-gap写成column-gap和row-gap，grid-gap写成gap。
页:
[1]