先记住这个答案
grid 是一个覆盖范围很广的简写：它包含 grid-template-rows、grid-template-columns、grid-template-areas，还包含 grid-auto-rows、grid-auto-columns、grid-auto-flow。CSS 简写的惯例是未指定的子属性回到初始值。因此先写 grid-auto-rows: 120px，后写 grid: auto / 1fr 1fr，自动行高就不再是 120px。
grid同时覆盖显式与隐式网格属性- 未写出的子属性会被重置
grid-template只管显式模板- 关注同一规则和媒体查询中的声明顺序
一个真实的覆盖场景
开发者常先定义重复卡片的自动行高，然后在媒体查询里改两列模板。若媒体查询用了 grid 简写，隐式行高会随着断点被重置。页面表现是宽屏卡片等高，窄屏突然随内容高低变化，而检查旧声明又确实还能看到 120px；问题在于它被后面的简写覆盖了。
grid 重置自动行高CSS.cards {
display: grid;
grid-auto-rows: 120px;
grid: auto / repeat(2, minmax(0, 1fr));
/* 此时 grid-auto-rows 已回到 auto */
}
.cards.fixed { grid-auto-rows: 120px; }最直接的修法是把需要的 grid-auto-rows 写在简写之后。若只想改显式模板，可直接写 grid-template-columns，或者用 grid-template 简写；后者不会顺手重置三个隐式网格属性。选择哪种形式取决于代码可读性，别为了省几个字把原本独立的设置绑在一起。
它究竟重置了什么
grid 覆盖六个网格定义属性，自动放置流向也在其中。例如之前设了 grid-auto-flow: column，后面一条只写模板的 grid 会把流向改回初始的 row。隐式列轨尺寸也会被重置为 auto。这些变化可能只在项目数量超过显式模板时暴露，所以开发时放两张卡片看不出来，线上多几张才触发。
但 gap、justify-items、align-items 不在 grid 的子属性中；写 grid 不会一并清掉它们。排查时应从浏览器计算样式里看受影响的具体长属性，不要笼统说“Grid 全被重置”。
容易答错的地方
- 以为简写没写就等于保留旧值
- CSS 简写一般会给每个子属性赋值。没在简写里写出的部分通常回到初始值，而不是沿用前面的声明。
- 把
grid-template和grid视为同义词 - 前者只控制显式行、列、区域；后者还覆盖隐式轨道尺寸与自动放置。两者处理多出来的项目时会有区别。
面试官还会怎么问？
grid 会重置 gap 吗？
不会。gap 是独立属性，不属于 grid 简写的六个子属性。
为什么项目少时没有发现问题？
隐式行或列尚未被创建，自动轨道尺寸的改变没有可见对象；多出项目才会暴露。
媒体查询里只想改单列，该写什么？
直接改 grid-template-columns: 1fr 最清楚，可以保留之前的自动轨道和流向设置。
参考资料
示例用于理解所注明的运行环境与边界；延伸学习可结合原文中的更多案例。