ie 全系列（含 ie11）完全不支持 initial 关键字，css 解析器直接丢弃整条声明，导致规则块可能被跳过；需手动替换为各属性在 mdn 中定义的初始值，如 background-color: transparent、font-weight: 400 等。
initial 在 IE（包括 IE11）中完全不被识别，不是“部分失效”或“表现异常”，而是 CSS 解析器直接丢弃整条声明——连带它所在的规则块都可能被跳过。这意味着你写 color: initial，IE 就当这行不存在；如果它在 display: flex 后面，甚至可能导致 flex 布局也不生效。
IE 对 initial 的支持状态是硬性缺失
IE 系列浏览器（所有版本，含 IE11）从未实现 initial 关键字。这不是渲染 bug，而是语法层面的不识别。W3C 规范虽定义了它，但 IE 的 CSS 解析引擎压根没注册这个 token。遇到就静默忽略，不会 fallback，也不会报错。
- Chrome 58 以下、Firefox 26 以下、Safari 6.1 以下同样不支持，但 IE 是最常踩坑的场景
- Element UI、Ant Design 等组件库内部若用了
text-align: initial或margin: initial，在 IE 中就会暴露为居中/撑开/错位等视觉问题 - Webpack + postcss-loader 若启用了
cssnano或类似压缩插件，有时会把transparent自动转成initial，进一步放大兼容性风险
查 MDN 文档确认每个属性的真实初始值
不能靠“感觉”替换，比如认为 background-color: initial ≈ background-color: inherit，这是错的。必须查对应属性在 MDN 上的 Initial value 栏：
-
background-color: initial→ 改为background-color: transparent（不是none，none不是合法值） -
font-weight: initial→ 改为font-weight: 400（normal的数值等价） -
border-style: initial→ 改为border-style: none（注意：不是0，0是长度单位，非法） -
display: initial→ 改为display: inline（所有元素默认 display 都是inline，除非是替换元素如img） -
margin: initial→ 拆成margin: 0（四方向初始值均为0）
PostCSS 插件无法自动修复 initial 兼容问题
很多团队误以为加个 postcss-preset-env 或 autoprefixer 就能“翻译” initial，其实不能。这些插件只处理属性名、选择器、函数等语法级特性，initial 是值（value），且没有等效的旧语法可映射——它必须被手动替换成确定的、浏览器普遍支持的字面值。
- 自研脚本做全局替换风险高：比如把
all: initial直接替成all: unset无效，因为 IE 连unset也不支持 - 更安全的做法是在 CI 流程中加入 ESLint 插件（如
stylelint-no-unsupported-browser-features），提前拦截含initial的提交 - 若项目已用到大量
initial，建议用正则:\s*initial\s*;全局搜索，逐条核对并替换，别依赖自动化“转换”
真正麻烦的不是找不到替代值，而是有些属性的初始值在不同上下文里语义不同（比如 line-height: initial 在块级和内联元素中表现一致，但开发者常误以为它会继承父级；实际上它永远是 normal，而 normal 的计算结果是不确定的）。这种隐式行为差异，比单纯不支持 initial 更难调试。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
