IE中的文字阴影

Question

我发现了一篇关于在IE中创建文本阴影的Stackoverflow文章：StackQuestion 现在我尝试了所有的“过滤器”解决方案，在IE9中，文本呈现得很糟糕（尽管阴影显示，文本像素化很多......）。

有没有人知道IE的正确文字阴影技术？即使它仅适用于IE9 ......

谢谢

Answer 1

查看此网站：http://css3pie.com/

这是一个允许您在IE6-9中使用CSS3的插件

Answer 2

你可以在Internet Explorer中获取文本阴影效果，驯服IE的crunky过滤器阴影效果，迫使它们看起来没问题并停止像素化文本。使用IE Chroma过滤器：

• 设置与阴影颜色接近但不相同的背景颜色 - 例如黑色阴影，深灰色，白色发光，浅灰色
• （在IE浏览器类或条件注释中的样式表或样式规则中设置背景颜色，以免在其他所有浏览器中破坏您的设计！）
• 在使用色度过滤器设置为与背景填充相同颜色的IE过滤器CSS规则之前
• 看起来（几乎）非常好！

jsfiddle examples（在IE8，IE9中加载）

...或者如果你没有轻松访问IE8 / 9，这里是IE9 IE8模式中的小提琴截图。请注意IE浏览器默认过滤器中可怕的，神器缠身的，像素化的混乱与相当清晰，看起来很正常的色度滤镜等效物之间的区别。

CSS代码示例。注意你有一个色度滤镜，然后是另一个滤镜，全部在一行上，引用一个-ms-filter - 以及色度颜色如何匹配背景颜色精确，以及色度如何颜色赞美（但不匹配）主效果颜色：

.chroma-glow {
    background-color: #dfdfdf;
    -ms-filter: "progid:DXImageTransform.Microsoft.Chroma(Color=#dfdfdf)progid:DXImageTransform.Microsoft.Glow(color=ffffff,strength=4)";
}
.chroma-shadow {
    background-color: #dfdfdf;
    -ms-filter: "progid:DXImageTransform.Microsoft.Chroma(Color=#dfdfdf)progid:DXImageTransform.Microsoft.Shadow(direction=135,strength=2,color=ffffff)";
}

---

一些要求（艰难地学习......）

• 元素必须为block或inline-block，不能为inline。
• 过滤器无法应用于position: relative;或position: absolute;的所有子项
  • （如果直接应用于position: absolute;或`position：relative; elements）
  ，它们可以正常工作
• 如果您要动态添加过滤器，例如使用像$elem.css('filter','progid...');这样的jQuery，似乎必须将背景颜色直接应用于元素，并使用色度过滤器才能工作。一些提示：
  • 效果颜色，应用背景颜色和色度颜色全部相同
  • 由于您只想在IE中使用此背景色，请使用特征检测或IE检测。