IE10/IE11及旧版Edge中字体模糊的根源是transform触发的低质量双线性插值，修复需组合-ms-transform与-ms-backface-visibility: hidden，并严格使用整数transform值。
transform 在 IE10/IE11 和旧版 Edge 中字体模糊的根源
根本原因不是“不支持 transform”，而是这些浏览器对 transform 渲染层的处理方式：它们会强制启用低质量的双线性插值（bilinear interpolation）对整个合成层做缩放或位移，且无法关闭。尤其当 transform: scale() 或 translate() 值含小数（如 scale(1.1)、translateX(0.5px)）时，文字被当作位图纹理重采样，直接变糊。
IE10+ 必须加的两个 hack 属性
仅靠 transform 本身无法修复，需组合以下两个声明才能触发更可控的渲染路径：
-
-ms-transform: scale(1.1);—— 显式使用私有前缀，避免某些 IE 版本忽略标准写法 -
-ms-backface-visibility: hidden;—— 这是关键。它强制 IE 将元素提升为独立合成层，并禁用导致模糊的默认插值模式；配合transform使用时，能显著改善文字边缘锐度
完整示例：
.text-element {
-ms-transform: scale(1.1);
transform: scale(1.1);
-ms-backface-visibility: hidden;
backface-visibility: hidden;
}
避免在 IE 中使用小数位移或非整数缩放
IE 对 subpixel rendering 的支持极弱，任何非整数值都会放大模糊。必须严格规避：
立即学习“前端免费学习笔记（深入）”；
- 不用
translateX(0.5px)，改用translateX(1px)或通过margin/padding调整位置 - 不用
scale(1.2)，改用scale(1)+ 手动调大font-size和容器尺寸 - 居中场景慎用
transform: translate(-50%, -50%)—— 当父容器宽高为奇数时，-50% 计算结果常为小数像素，IE 下必糊；可改用display: flex或绝对定位 +left: 50%; margin-left: -XXpx
filter: blur(0) 在 IE 中无效，别白费力气
网上流传的 filter: blur(0) 在 IE10/11 中完全不生效，它只影响 SVG 或部分滤镜链，对 transform 引起的文本模糊无作用。同理，-webkit-font-smoothing 等 WebKit 属性在 IE 下无意义。真正有效的只有：-ms-backface-visibility: hidden + 整数 transform 值 + 避免硬件加速滥用（IE 下 will-change: transform 反而加重模糊）。
