logo标签列表

CSS 透明度在 IE7 中无法正常工作

cssinternet-explorer-7opacity
10

我有一个测试页面：http://jsfiddle.net/VWnm9/7/。这个图片在我所有运行IE7或IE8的电脑上都正确地淡出，除了一个运行IE7的电脑，即使在noext模式下也不会淡出花朵。

该页面为：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <style type="text/css">
        body {
            background: blue;
        }
        img {
            filter: alpha(opacity=10);
            opacity: 0.1;
        }
    </style>
</head>
<body>
    <img src="http://upload.wikimedia.org/wikipedia/commons/c/c3/Extracted_pink_rose.png" />
</body>
</html>

有人知道为什么吗？

可能是css opacity not working in IE7的重复问题。 - bobince
实际上，我发了两次帖子。第一次，Stack Overflow将我重定向到“提问”页面，因此我以为我的问题丢失了。 - Alsciende
最好弄清楚那些能够正常工作的IE7机器和那些不能工作的IE7机器之间的区别。IE7版本与Microsoft更新可能略有不同？ - Alex
我注意到在某些运行于Win 2k3 Server机器上的IE7机器中，filter：alpha缺乏支持。也许这取决于一个图形库，该库包含在Windows XP中但未包含在2003服务器中？ - nothingisnecessary
4个回答
21
它不起作用。据我所知，-ms-filter是为IE8兼容模式设计的。 - Alsciende
1
看起来IE可能需要对元素进行定位才能对其应用滤镜。尝试添加zoom: 1。更多信息请参见：http://joseph.randomnetworks.com/archives/2006/08/16/css-opacity-in-internet-explorer-ie/ - mqchen
这样简单的图像已经有了布局。但是我尝试了zoom:1和设置宽度和高度以确保：什么也没有改变。 - Alsciende
很抱歉，我似乎无法重现这个错误，如果它只出现在你的某一台机器上，那么我对问题可能是什么感到茫然。也许早期IE7版本中存在一个错误，而那台机器的IE7尚未修补？ - mqchen
0

不是100%确定，但这可能是因为IE在透明PNG上使用opacity时存在问题：请参见此SO问题

我成功测试了8台电脑。只有1台电脑没有淡化图像。使用的CSS应该是有效的，也确实有效。问题在于一个不工作的IE7。 - Alsciende
@Alsciende 这是IE 7的普遍问题还是只有一个电脑的问题？ - Pekka
0

我通常会使用半透明的 .PNG 文件。当你需要支持 IE6 和某些版本的 IE7 时，这比 CSS hack 更好的解决方案。

我认为IE6需要一些JavaScript黑科技才能理解PNG图片中的alpha透明度。例如，这里有一个解决方法：http://www.twinhelix.com/css/iepngfix/。 - mqchen
我需要通过JavaScript调整不透明度，因此这不是一个选项。 - Alsciende
0

PNG 图像在这种情况下非常适用。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接