Question

当我在我的div上只使用圆角时，它看起来我在IE9中的期望。

border-radius: 7px;

但是，当我添加以下行来制作投影时，我会收到意想不到的效果：

filter: progid:DXImageTransform.Microsoft.Shadow(color='#818181', Direction=135, Strength=3);

这是效果的屏幕截图。我指的是突然附加在我浅蓝色div上的丑陋小黑角：

我该怎样摆脱它？

Answer 1

IE9原生支持box-shadow，因此无需使用旧的filter样式。

如果您使用filter以获得旧版IE的好处，那么可能是两个阴影都在IE9中发挥作用，并且略有不同，从而导致奇怪的效果。

我的第一个建议就是放弃filter风格。这意味着IE的版本不会看到框阴影，但它并不是布局的关键元素。

如果这不好，那么我建议使用CSS3Pie来实现旧版IE的框阴影。作为奖励，它也会border-radius。

使用CSS3Pie，您可以在旧版本的IE中使用标准的CSS box-shadow样式，而不必担心filter样式。并且，为了显示它如何直接回答你的问题，它将在IE9中自动关闭，因此你不会得到双重阴影效果。

希望有所帮助。