Chrome 和 IE 中的不透明度问题答案

【问题标题】：Opacity issues in Chrome and IEChrome 和 IE 中的不透明度问题
【发布时间】：2010-06-17 12:51:38
【问题描述】：

我在 IE 7 和 Chrome 中看到了奇怪的行为，在我的导航中更改了透明背景 png 的不透明度。

CSS：

 ul.tabs a {
    height: 48px;
    filter:alpha(opacity=80);
    -moz-opacity:0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
    }

 div.header ul.tabs a:hover {  
    filter:alpha(opacity=100);
    -moz-opacity:1;
    -khtml-opacity: 1;
    opacity: 1;
    }

【问题讨论】：

您可能希望链接到您正在使用的相关图像，以防它与格式相关问题

标签： css cross-browser opacity

【解决方案1】：

我相信在 IE7 中渲染看起来很糟糕的原因是因为 IE7 不能很好地处理不透明度。 Rick Strahl 在一篇名为 Internet Explorer 7.0 and Opacity: Not even close!

的博文中注意到了这个问题

对该博客文章的一条评论链接到 IE 博客文章 Notes on the interaction of ClearType with DXTransforms in IE7，我们了解到 IE 团队已意识到该问题并提供了包含此 gem 的“解释”：

“正如我们的用户也注意到的那样，ClearType 文本看起来非常模糊 - 不幸的是这两种技术不能很好地混合。这是因为 DXTransforms 使用的基本卷积变换没有考虑 ClearType 的空间特性。 "

我相信 IE 团队能够将 ClearType 空间卷积转换责任合并到 IE8 中，但是遗憾的是，这并没有进入 IE7。

【讨论】：

嗯..改天..我鄙视 IE 的另一个原因。我最终只是做了 CSS 图像翻转.. 感谢您的回复。