Question

我为div创建了一个内部阴影，如下面的css代码所示：

.gil_Help_ContentArea {
    width: 300px;
    height: 200px;
    margin: 5px 0 0 0;
    padding: 0px; 
    background-color: #fff;
    box-shadow: inset 0 0 10px #ccc;
    -moz-box-shadow: inset 0 0 10px #ccc;
    -webkit-box-shadow: inset 0 0 10px #ccc;
    -khtml-box-shadow: inset 0 0 10px #ccc;
}

它与IE以外的浏览器一起工作正常，但我想在IE中使用相同的效果。如果有人愿意提供帮助，我们将不胜感激。

您可以在http://jsfiddle.net/shabirgilkar/Mu9jL/处查看效果。

Answer 1

IE 8及更低版本不支持box-shadow CSS3属性，但可能可以使其工作。你应该看看这些文章......

我建议在IE 8及以下版本中使用图像（使用条件样式表）。

我想出了一个糟糕的解决方案，但它适用于IE 8，Chrome，Firefox，Safari和Opera。看看小提琴......

http://jsfiddle.net/UnsungHero97/Mu9jL/3/

我希望这会有所帮助赫里斯托斯

Answer 2

http://css3generator.com/

选择框阴影

-webkit-box-shadow: inset 0px 0px 15px #313199;
-moz-box-shadow: inset 0px 0px 15px #313199;
box-shadow: inset 0px 0px 15px #313199;

您指的是哪个版本的IE？不同的版本大不相同。

Answer 3

目前（2011年11月），似乎没有人为IE8或IE7开发了一个polyfill来做你想做的事情。例如，参见CSS3PIE（https://github.com/lojjic/PIE/issues/3），它支持box-shadow但不支持插入标记。

您最好的（仅限？）选项是创建一个图像以用作元素的背景。显然，这不是一个很好的解决方案。

（另外，为了帮助您和其他人找到其他有用的polyfill，这里有一个可能有用的链接：https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills）

在IE中内部阴影到div

3 个答案: