プロジェクトで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>
どんな助けでも大歓迎です。