过滤不透明度不起作用

时间:2013-02-06 15:49:07

标签: css internet-explorer-8 opacity

出于某种原因过滤:IE8中的不透明度不起作用。我有一段时间没有使用它,但它总是有效,我不知道问题是什么。另外,firebug根本没有显示过滤规则,只是正常的不透明度。

有什么想法吗?

ul.products-grid img:hover {

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

5 个答案:

答案 0 :(得分:1)

标签是

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

试试这个

答案 1 :(得分:1)

在IE8中,您可能还需要;

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

您也可以查看Cross Browser Opacity

答案 2 :(得分:1)

试试这个:

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]-->

答案 3 :(得分:0)

同时检查您的页面是否在IE中以怪异模式呈现。我认为IE8可能不支持:在任意元素上使用hover伪类,除非它处于标准兼容模式。

类似的情况和解释here

答案 4 :(得分:0)

你的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>