ie11 不支持现代 css grid，需手动使用 display: -ms-grid 及配套属性；autoprefixer v9+ 已移除 ie grid 转换能力，-ms-grid-column-span 等仅接受正整数，且必须显式定义行列位置。
IE11 不支持 display: grid，它压根不解析这条声明——不是漏前缀，是语法不认识。必须手动写 display: -ms-grid，否则整套 Grid 布局在 IE11 里直接退化成 display: block。
IE11 的 Grid 是另一套东西，不是加前缀就能跑通
现代 CSS Grid（2017 年 W3C 推荐标准）和 IE11 实现的 -ms-grid（2012 年旧草案）语义差异极大：
-
grid-template-areas、grid-gap、minmax()、auto-fit这些特性 IE11 完全不识别，Autoprefixer 遇到就跳过整条规则 -
fr单位虽能在-ms-grid-columns中出现，但混用auto 1fr会触发 IE11 渲染异常，建议统一用百分比或固定值 -
@supports (display: grid)在 IE11 中静默失效，整段规则被忽略，无法用于 fallback 分流
Autoprefixer v9+ 已彻底放弃 IE Grid 转换
从 Autoprefixer v9（2021 年起）开始，官方移除了对 IE Grid 的语法转换能力。即使你在 postcss.config.js 里写了 autoprefixer({ grid: true })，也不会生成任何 -ms-grid- 属性。
- 它只做前缀补全，不是语法翻译器：必须先写
display: -ms-grid，它才可能补-ms-grid-columns等配套属性 - 如果源码只写
display: grid，Autoprefixer 拿不到输入，输出为空 - 降级到 v8.x 并不可靠：实测常漏定义行列、跨度错位、把
gap转成无效margin，调试成本远高于手写
grid-column: 1 / -1 这类写法在 IE11 中完全失效
IE11 的 -ms-grid-column-span 只接受正整数，不支持负值、span 关键字或隐式轨道计算。
-
grid-column: 1 / -1或grid-column: span 3→ Autoprefixer 直接跳过，不生成任何-ms-属性 - 结果是子项默认落在第 1 列第 1 行，整个布局错位
- 正确做法：手动算清总列数，例如父容器定义了 4 列，横跨全部 → 写
grid-column: 1 / 5 - 避免用
grid-area：它无法映射为-ms-grid-row+-ms-grid-column，必须拆解成grid-row-start和grid-column-start
最常被忽略的是：-ms-grid 是静态网格，没有自动定位能力——每个子项都得靠 -ms-grid-column 和 -ms-grid-row 显式指定位置，漏一个就会错位；而且所有行列定义必须预先写死，不能依赖隐式轨道或响应式计算。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
