1

我在一个项目中使用Twitter Bootstrap的字形图标，并希望它们在 :hover 上变得部分透明。当然，在 Chrome、FF、Safari 甚至 IE9+ 中一切正常。

然而，在 IE7 和 IE8 中，不透明度使图标看起来很糟糕。以下是测试的要点：

<!doctype html>
<html>
    <head>
        <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
        <style>
            #icon {
                margin: 50px;
            }

            #icon:hover {
                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
                filter: alpha(opacity=70);
                opacity: 0.7;
            }
        </style>
    </head>
    <body>
        <i id="icon" class="icon-search"></i>
    </body>
</html>

任何帮助将不胜感激。

4

1 回答 1

0

尝试更改顺序，以便后备在实际声明之后。

#icon:hover {

opacity: 0.7;
filter: alpha(opacity=70);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";

}
于 2013-02-05T12:25:15.507 回答