Question

我有一个页面，它使用IE8的AlphaImageLoader CSS过滤器，如下所示：

filter：progid：DXImageTransform.Microsoft.AlphaImageLoader（src ='/ images / thing.png'，sizingMethod ='scale'）;

在我的测试IE8（Windows XP，出厂设置）中，一切都很好。然而，客户端收到了声称也在使用IE8的人的截图，看起来浏览器完全忽略了filter指令。通过条件注释加载的IE特定样式表中的所有其他样式似乎都有效。在IE或Windows中是否有任何设置会导致此问题？

谢谢，西蒙

Answer 1

IE8将filter替换为-ms-filter。

如果您想支持所有版本的IE，您需要提供这两种样式。

-ms-filter的语法与filter略有不同：

现在使用完整的progid字符串指定所有过滤器（根据您的示例，但之前可以使用较短的语法指定某些过滤器）。
-ms-filter的值必须用引号括起来。这是为了防止它成为无效的CSS语法（因为它在progid之后包含冒号它是无效的CSS;在已知的情况下，已知会导致其他浏览器中的解析错误阻止它们读取CSS的其余部分文件正确）。

因此，在您的示例中，您需要以下样式：

.myelement {
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/thing.png', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/thing.png', sizingMethod='scale')";
}

请注意，IE9已经放弃了对filter和-ms-filter的支持，转而支持等效的标准CSS3属性。

希望有所帮助。

Answer 2

这个简单的测试用例：http://fiddle.jshell.net/TyMxr/show/light/

<div></div>

div {
    border: 2px solid red;
    width: 256px;
    height: 256px;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.gravatar.com/avatar/74c04b6c96836f044ed927a5db4dc92b?s=128&d=identicon&r=PG', sizingMethod='scale');
}

适用于任何版本的IE6，IE7，IE8，IE9和Quirks Mode。

我想不出任何在IE中无效的原因。

你有一个测试页面要看吗？我认为还有其他事情必须继续。

IE8忽略“过滤”CSS样式

2 个答案: