文字阴影 IE-9答案

【问题标题】：Text-Shadow IE-9文字阴影 IE-9
【发布时间】：2015-12-06 02:28:21
【问题描述】：

我有一个适用于 IE11、Google Chrome、Safari 和 Firefox 的 CSS3 text-shadow 属性。是否可以将 text-shadow 值转换为 IE9“兼容”？我想让 IE9 和 IE11、Google Chrome、Safari 和 Firefox 一样的效果

.title {
    text-shadow: 0 1px 0 #ccc, 
    0 2px 0 #c9c9c9, 0 3px 0 #bbb,
    0 4px 0 #b9b9b9, 0 5px 0 #aaa,
    0 6px 1px rgba(0, 0, 0, 0.1),
    0 0 5px rgba(0, 0, 0, 0.1),
    0 1px 3px rgba(0, 0, 0, 0.3),
    0 3px 5px rgba(0, 0, 0, 0.2),
    0 5px 10px rgba(0, 0, 0, 0.25),
    0 10px 10px rgba(0, 0, 0, 0.2),
    0 20px 20px rgba(0, 0, 0, 0.15);
}

【问题讨论】：

感谢分享文章。我以前看过那篇文章。但是“过滤器”并没有多个值来创建与 IE11、Google Chrome、Safari 和 Firefox 相同的效果。
我不认为有任何机会在 IE9 中实现这样的文本阴影。所以想想优雅的降级。

标签： css internet-explorer

【解决方案1】：

这里有解释：https://stackoverflow.com/a/6905713/1165121 IE 6-9 使用自己专有的过滤方法。

您应该重新考虑在每个浏览器中查看完全相同的网页，这在现在有点过时了。

【讨论】：

关于你的第二个声明：w3.org/wiki/Graceful_degradation_versus_progressive_enhancement

【解决方案2】：

我认为您可以尝试http://css3pie.com/，它基本上是旧版 IE 上 CSS3 的兼容层。例如：

.title {
    text-shadow: <whatever>;
    behavior: url(path/to/pie_files/PIE.htc);
}

【讨论】：

谢谢安德鲁。很高兴知道！但是，根据css3pie.com/documentation/q-and-a，它只支持box-shadow，不支持text-shadow。
还要注意它必须是协议：//absolute.path.webseite/pie_files/PIE.htc css3pie.com/documentation/known-issues/#relative-paths

【解决方案3】：

以下是您可以选择的一些选择：

编写另一个旧浏览器支持的漂亮的 css 布局。
使用图像。那里有一些文本到图像的转换器，也可以进行自动化处理（需要做一些工作）
您可以尝试查找JS-SVG library with VML support 并使用它来即时创建图像。 VML是old-ies的内置矢量图形格式，类似于svg。

【讨论】：