internet-explorer - 如何为 IE 转换此 box-shadow 属性？

Question

我将此属性用于框阴影：

 box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);

它不适用于IE。我在网上查了一下，发现我可以使用这样的东西：

filter: progid:DXImageTransform.Microsoft.Shadow(color=#aaaaaa,direction=135,strength=10); 

但我不确定如何为这个 IE 片段使用我的 box-shadow 值。我怎样才能转换它？

Answer 1

不幸的是，旧 IE 上没有自动生成框阴影过滤器。

我能提供的最佳建议是使用 CSS3 Pie（链接在这里找到）。它提供了 CSS3 特性，如border-radius, linear-gradient, 以及box-shadow, 一直到 IE6。

有点切线，但有一个非常酷filter的 rgba / hsla 颜色自动生成器，由 Kimili 完成（链接在这里找到）。对 IE6-8没有帮助box-shadow，但它非常适合使用那些疯狂的过滤器background-color在 IE6-8 上创建不透明度。

Answer 2

它适用于 IE 9、10 和 11。您只需要 IE 8 及以下版本的过滤器。您还应该为较旧的 Android 浏览器和 iOS Safari 以及较旧的黑莓添加它的 -webkit 版本。

-webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);

您可以在旧版本的 IE 中尝试这些：

/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#000000')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#000000');

或者，如果您必须支持旧版本的 IE，您可能会考虑使用类似http://css3pie.com/的库，它会为您处理 box-shadows（和其他事情）。

Answer 3

最好去看看 msdn.microsoft.com 网站http://msdn.microsoft.com/en-us/library/ms673539(v=vs.85).aspx。
在这里，您可以使用不同的过滤器。
请注意，您可以将框或文本阴影中的过滤器与 : 相乘，
检查阴影和阴影过滤器，您也许可以使一些安静的相似。
如果阴影也适用于文本，请为元素提供背景，例如一个像素图像，如果您不想要背景，则为数千像素。
希望能帮助到你 。
请注意，为这么少的访客花费的时间可能不值得。干杯