过滤不透明度不起作用答案

【问题标题】：Filter opacity not working过滤不透明度不起作用
【发布时间】：2013-01-21 21:17:55
【问题描述】：

由于某种原因过滤器：不透明度在 IE8 中不起作用。我有一段时间没有使用它，但它总是有效，我不知道问题是什么。此外，萤火虫根本没有显示过滤规则，只是正常的不透明度。

有什么想法吗？

ul.products-grid img:hover {

    opacity: .8;
    filter:alpha(opacity=80);
}

【问题讨论】：

标签： css internet-explorer-8 opacity

【解决方案1】：

标签是

filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);

试试这个

【讨论】：

【解决方案2】：

在IE8中，你可能还需要；

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";

你不妨看看Cross Browser Opacity

【讨论】：

【解决方案3】：

试试这个：

ul.products-grid img:hover {
    opacity: .8; /* Standards Compliant Browsers */
    filter:alpha(opacity=80); /* IE 7 and Earlier */
    /* Next 2 lines IE8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
}

如果您希望您的页面为validate，请使用如下 if IE 语句将您的标准样式表与 IE 样式表分开：

<!--[if IE]>
<link rel="stylesheet" type="text/css"  href="stylesheetname.css" />
<![endif]-->

【讨论】：

【解决方案4】：

还要检查您的页面是否在 IE 中以 quirks 模式呈现。我认为 IE8 可能不支持任意元素上的 :hover 伪类，除非它处于标准遵从模式。

类似情况及说明here.

【讨论】：

【解决方案5】：

您的 CSS 工作正常。在此处查看演示，http://jsfiddle.net/e26Pz/2/

也许问题可能出在DOC 类型上。在示例中我使用了<!DOCTYPE html>

您使用的是什么Doc 类型？

完整的演示代码

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo</title>
  <style type='text/css'>
    img:hover {    
       opacity: 0.4;
       filter:alpha(opacity=40);
    }
  </style>

</head>
<body>
     <img src="https://fbcdn-sphotos-h-a.akamaihd.net/hphotos-ak-prn1/69651_408104205949356_2097957740_n.jpg" />      
</body>   
</html>

【讨论】：

不错的小提琴，但你在 IE8 中测试过吗？对我来说，jsfiddle.net 似乎甚至无法在 IE8 中运行。
我检查了 IE8 并为我工作。试试这个链接，fiddle.jshell.net/e26Pz/2/show
是的，那个在 IE8 中对我来说很好用。然而，现在我很困惑，因为大多数消息来源似乎都声称 IE8 需要 -ms-filter 规则。