先记住这个答案
grid-template-rows 和 grid-template-columns 写出的轨道叫显式网格。项目超出这些轨道时，Grid 仍要把它摆进去，于是产生隐式行或列。自动放置项目排满已声明的位置、项目手动指定超出末尾的线，都可能触发这种扩展。隐式行的尺寸看 grid-auto-rows，隐式列的尺寸看 grid-auto-columns。
- 项目超出显式模板会产生隐式轨道
- 自动行高用
grid-auto-rows控制 - 自动列宽用
grid-auto-columns控制 minmax()可同时给下限和伸展空间
自动列表为什么越长越高
卡片容器只声明三列，没有声明固定行数。前三张占第一行，再来的卡片需要第二行，这行就是隐式行。默认尺寸随内容计算，卡片高度可能不一致；如果产品希望每行至少有 120px，可以给 grid-auto-rows 一个下限，同时允许文字增多时长高。
.cards {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-auto-rows: minmax(120px, auto);
gap: 16px;
}
/* 第 4 张起会进入后续隐式行，行高至少 120px */这里没有设置 grid-template-rows，所有按需创建的行都遵循自动行尺寸。minmax(120px, auto) 比固定 120px 更适合内容可变的卡片：内容超出时行轨可继续长高。若写死高度，文字可能从格子里溢出，而不是神奇地缩小字体。
隐式列不只来自列方向流动
grid-auto-flow: column 常会持续建立新列；项目用 grid-column: 4 / 5 定位到仅有两列的容器时，也能迫使网格延伸到第四列。此时新增列的宽度由 grid-auto-columns 规定，没设置则使用初始的自动尺寸。开发工具里的 Grid 线条能帮你看到哪些是显式轨道、哪些是被项目撑出来的。
需要记住自动行列属性不控制显式模板。例如已经声明 grid-template-rows: 80px，再写 grid-auto-rows: 120px，第一行还是 80px，新增的行才使用后者。若两种轨道之间还有 gap，交界处照样有沟槽。
例如模板只声明第一行高 80px，列表继续生成第二、三行，后两行就是隐式轨道，尺寸受 grid-auto-rows 控制。若某项目明确定位到模板末端之外，也能创建隐式轨道，即使 grid-auto-flow 仍是默认的 row。看见新列时，不应一口断定是 column 自动放置造成的；先找是否有项目写了越界的 grid-column 线号。
容易答错的地方
- 以为模板只定义三列就只能放三张卡片
- 额外项目会进入后续行或列，不会被 Grid 丢弃。生成方向受自动放置规则影响。
- 以为
grid-auto-rows会覆盖第一条显式行 - 它只用于隐式行。第一条显式行仍按
grid-template-rows计算。
面试官还会怎么问？
固定隐式行高会自动裁剪内容吗？
不会。轨道固定后内容可能溢出，裁剪还要看项目或容器的 overflow。
自动创建的行之间还有 row-gap 吗？
有。沟槽作用于相邻行轨，显式与隐式行之间也一样。
什么时候用 minmax(120px, auto)？
希望每行不低于 120px，又允许多行文字把该行撑高时适合使用。
参考资料
示例用于理解所注明的运行环境与边界；延伸学习可结合原文中的更多案例。