IE6–8不支持text-shadow，需用filter: progid:DXImageTransform.Microsoft.Shadow(Color=#666, Direction=135, Strength=2)模拟，须触发hasLayout且避免与现代属性混写。
IE6–8 里 text-shadow 根本不生效，得换路子
现代 CSS 的 text-shadow 在 IE6–8 完全被忽略，连解析都不解析。想在这些浏览器里模拟出类似效果，唯一可行路径是用 IE 私有滤镜 filter 中的 Shadow。它不是标准属性，但 IE5.5–8 原生支持，且只对文本节点（或有 layout 的块）起作用。
- 必须给元素触发 hasLayout（比如加
zoom: 1或position: relative），否则滤镜无效 -
Shadow滤镜只能设一个方向（Direction）和一个颜色（Color），不能像text-shadow那样多层、模糊、偏移自由组合 - 方向值是角度：0=正右，45=右下，90=正下，135=左下……注意 IE 的 0° 和 CSS 的 0° 方向一致，但不支持负角度
filter: progid:DXImageTransform.Microsoft.Shadow 的写法和限制
这是唯一能用的语法，必须写成完整 progid 形式，不能简写。常见错误是漏掉 progid: 前缀，或把括号写成花括号，或混用英文引号——IE 会直接忽略整条规则。
- 正确写法：
filter: progid:DXImageTransform.Microsoft.Shadow(Color=#666, Direction=135, Strength=2); -
Strength控制“阴影长度”，不是模糊度，数值越大，阴影拉得越长（类似 offset），最大建议不超过 10，否则边缘锯齿极重 - 该滤镜不支持透明色，
Color必须是十六进制（如#000）或命名色（如gray），rgba()会退化为纯黑 - 若同时用了其他滤镜（如
Alpha），要用空格拼接，不能逗号分隔：filter: Alpha(opacity=80) Shadow(Color=#333, Direction=135, Strength=3);
如何安全地让现代浏览器和 IE6–8 各走各的路
不能把 filter 和 text-shadow 写在同一规则里裸奔——IE9+ 会尝试解析 filter 并失败，导致整个样式块失效（尤其当它出现在关键选择器中时）。得靠条件注释或 CSS hack 隔离。
- 推荐用条件注释加载独立 IE 样式表：
<!--[if lt IE 9]> <link rel="stylesheet" type="text/css" href="ie-fix.css"> <![endif]-->
- 如果必须内联，可用
*filter（IE7 及以下识别）或_filter（仅 IE6）做降级，但注意filter本身在 IE8 也有效，所以更稳妥的是用\9hack：filter: progid:... \9; - 千万别在同一个声明块里混写
text-shadow和filter，哪怕加了!important，IE8 下仍可能因解析错误丢弃后续所有样式
阴影看起来“糊”或“断层”的真实原因
这不是你代码写错了，而是 IE 的 Shadow 滤镜本质是位图叠加：它把文字原图复制一份、按 Direction 平移 Strength 像素、再用指定颜色填充，全程无抗锯齿、无半透明混合。所以你会看到：
- 小字号文字阴影边缘全是硬边马赛克，尤其 Direction=45/135 时最明显
- 如果背景是渐变或图片，阴影区域会“盖住”背景细节，因为它是实色块，不是带 alpha 的投影
- 行高不够时，阴影可能被父容器
overflow: hidden截断——Strength越大，越容易出这事 - 开启 Cleartype 的 IE 下，文字本身渲染更锐利，反而让阴影对比更刺眼；关掉 Cleartype 后阴影略柔和，但正文也变虚——这是系统级权衡，CSS 无解
真要兼顾可读性和视觉接近度，Direction=90 + Strength=1~2 是最稳的选择，别贪多。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
