ie11支持transition，但需满足两个硬性条件：文档模式必须为ie11标准模式，且transition声明必须显式写出具体属性（禁用all），否则会被彻底忽略。
能，但必须满足两个硬性条件：文档模式是 IE11 标准模式，且 transition 声明写法正确。IE11 本身支持标准 transition，不是靠前缀，也不是“勉强可用”——它要么完全生效，要么彻底失效，没有中间状态。
为什么写了 transition 在 IE11 里还是没动画？
最常见原因是文档模式被降级了。IE11 会根据 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 或 HTTP 响应头 X-UA-Compatible: IE=edge 决定用哪个渲染引擎。一旦触发兼容性视图（比如页面里有 IE=8 的 meta，或服务器返回了 IE=9 头），哪怕用 IE11 打开，实际运行的仍是 IE9 引擎——而 IE9 完全不解析 transition 声明，开发者工具里会直接划掉整行，标为 “invalid”。
- 检查开发者工具的“仿真”面板，确认当前文档模式显示的是 “IE11 标准模式”，不是 “IE9 标准模式”（后者只是模拟，不代表真实 IE9 行为）
- 确保
<meta>标签位于最顶部，前面不能有任何 script 或注释 - 用
document.documentMode在控制台打印值，必须是11，不是9或10
transition 声明在 IE11 里怎么写才不被忽略？
IE11 对简写语法极其敏感，稍有不一致就会清空整个过渡链。它不接受“继承式”写法，也不吃媒体查询里的覆盖逻辑。
- 必须显式写出要过渡的属性，避免用
all—— IE11 不支持background-position、box-shadow等属性的过渡，all会导致整条声明被丢弃 - 每个元素单独写完整声明，例如：
transition: transform 0.3s cubic-bezier(.25,.46,.45,.94), opacity 0.3s ease; - 不要在父元素设
transition: all .3s，再指望子元素只动transform—— IE11 会直接忽略子元素的隐式继承 - JS 动态加 class 后，别立刻读取
offsetWidth或调用getComputedStyle—— 这会强制同步布局，打断过渡初始化
IE11 中 transition 卡顿或文字模糊怎么办？
这不是代码写错了，而是 IE11 的合成层调度和插值策略有问题。它默认对 transform 使用低质量双线性插值，尤其在小数位移或缩放时，文字直接发虚；同时，硬件加速通道不会自动开启，动画容易掉帧。
- 修复模糊：必须加
-ms-backface-visibility: hidden+backface-visibility: hidden，并确保transform值是整数（如translateX(1px)，而非0.5px） - 触发 GPU 合成：优先用
transform: translate3d(0, 0, 0)，比translateX()更可靠；will-change: transform在 IE11 完全无效，别写 - 避免 layout thrashing：所有样式写操作批量完成，读操作（如
getBoundingClientRect()）用requestAnimationFrame包裹，且放在下一帧 -
transitionend事件可能延迟或丢失，建议加setTimeout兜底清理临时 class
真正容易被忽略的是：很多人在 IE11 里把文档模式手动切到 “IE9 标准模式” 测试，然后断言 “IE11 不支持 transition”——但那其实是 Trident 5.0 引擎的行为，和真实的 IE11 渲染无关。验证兼容性，必须用真实文档模式 + 真实属性声明组合，缺一不可。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
