Question

我使用它为我的页面上的几个图像设置box-shadow属性，它在Firefox和Chrome上运行良好，但拒绝在Internet Explorer 9上运行。

box-shadow: 0px0.5px8px1px  #888888;

AND

box-shadow: rgb(150,150,150) 0 0 20px;

我是否应该使用其他东西才能与IE9兼容？

Answer 1

这在IE9中对我有用：

box-shadow: 0px 0px 4px 0px rgba(28, 24, 28, 0.65);

与hex相同：

box-shadow: 0px 0px 4px 0px #000000;

如果这样做无效，请尝试以下操作：按F12并阅读您使用的browsermod / documentmode。我们可以为您提供更多帮助。

Answer 2

感谢Sparky672和ShogunArts.de的帖子。他们发布的CSS由IE9支持。

我遇到的问题是我的自定义品牌在页面上强制IE8模式。一旦我在元标记中将其更改为IE9，所有样式都显示正常！

Answer 3

我还有一个自定义品牌，设置为IE8浏览器模式。

 <meta http-equiv="X-UA-Compatible" content="IE=9"/>

一旦我将其改为IE9，它就像一个魅力！

Answer 4

可能值得检查IE9是否处于IE7模式。检查您的IE Developer工具。 IE9需要处于IE9模式才能使box-shadow正常工作。

Answer 5

在没有htc文件的情况下以这种方式完美地为我工作

.shadow{
    margin:10px;
    padding:20px;
    background-color:#FFF;
    position:relative;
    z-index:2;
    border:1px solid #bebebe;
    -moz-box-shadow: 5px 5px 10px #CCC;
    -webkit-box-shadow: 5px 5px 10px #CCC;
    filter:progid:DXImageTransform.Microsoft.Blur(pixelradius=5);
    -ms-filter:"progid:DXImageTransform.Microsoft.Blur(pixelradius=5)";
    opacity:1;
    box-shadow: 5px 5px 10px #ccc;
}

Answer 6

顺序无关紧要（首先是颜色 - >值>反之亦然），只需确保数值正确。

确保在您的值之间包含空格。仅使用0也是无效的（它应该是0px）。

如果您需要更多帮助，请查看以下内容： http://yearofmoo.com/2011/03/ie9-and-css3-box-shadow/

Box-shadow CSS样式在IE9中不起作用？

6 个答案: