css 网格轨道

grid-template-columns 和 grid-template-rows 属性来定义网格中的行和列。

这些属性定义了网格的轨道，一个网格轨道就是网格中任意两条线之间的空间。

在下图中你可以看到一个绿色框的轨道——网格的第一个行轨道。第二行有三个白色框轨道。

以下实例我们使用 grid-template-columns 属性在网格容器中创建四个列:

实例

.grid-container { display: grid; grid-template-columns: auto auto auto auto; }