Question

我正在Drupal网站上工作。客户希望该网站在包括IE6在内的所有浏览器中看起来都相同。 IE中的box-shadow属性存在一些问题。我知道IE不支持CSS3属性。对于IE-6的盒子阴影是否有任何替代解决方案，以便它看起来像IE6和IE7中的阴影。我已经尝试过css PIE，其中我使用IE的htc文件来支持CSS3属性。但它不起作用。该网站的网址为Godsak

CSS代码

.portal-top {
background-color: white;
box-shadow: 0 0 20px #000000;

-moz-box-shadow：0 0 20px＃000000; -webkit-box-shadow：0 0 20px＃000000; 位置：相对; 保证金：15px auto 0; }

对于IE我正在使用

.portal-top {
background-color: white;
box-shadow: 0 0 20px #000000;
zoom:1;
filter: progid:DXImageTransform.Microsoft.Shadow(color='#000000', Direction=145, Strength=3);

}

现在在IE-7中显示了box-shadow。但不是我想要的。在IE-6中仍然没有阴影显示。看看firefox中的url，我需要同样适用于IE。可能吗。

提前致谢。

Answer 1

我个人认为解决问题的唯一解决方案是过度使用图像。没有阴影效果，只是图像。你可以从其他浏览器制作截图。

第二种替代方式是“降级”您的网站，并仅使用ie6支持的元素。

当然有很多黑客攻击和一些javascript解决方法但是这些都是一个非常糟糕的混乱，并且在大多数时候都会花费很多时间。

如果有人仍然拥有ie6，那么可能是有原因的。

我会说在不同的浏览器中网站看起来不同是完全正常的。这就是它的方式。当然，每个网站都应该正常工作并呈现漂亮。但是，如果你不以错过的方式使用元素，那就几乎可以保证使用元素。

如果有人使用ie6，那就没有阴影，就是这样。

但是作为客户要求的问题的答案，请选择图像解决方案。

Answer 2

如果你不满足于中国，最好的办法就是不要做额外的事情来缓解IE6的滑稽动作。

如果由于客户的要求而无法做到这一点，请向客户解释您必须为IE6做一个完全不同的网站（这是我最后看到的欧洲数字百分比），并且这将花费他几乎如果你这样做可以加倍。不仅是现在，而是每次更新网站。

实际上，没有可维护的方法可以让这些花哨的CSS东西在IE6上运行。

Answer 3

对于PIE ：

您需要在每个其他css元素之后包含该行为：

#container{
    margin:0 auto;
    width:900px;
    ...
    behavior: url(css/ie/PIE.htc); /* url at http://www.indivar.info/godsak/ */
}

最后一个样式表，最后一个元素。网址是来自网页而非样式表的相对路径

我还要补充一点，不建议使用@import。您可以尝试page speed。

网站看起来很棒。希望它有所帮助。

CSS Box阴影在IE6和IE7中不起作用

3 个答案: