1
div：：after擬似要素を使用してdivの下部に尖った三角形を描画しています。それは設計どおりに動作します。しかし、divの不透明度フィルタを追加すると、IEでの動作が停止します（IE8でテストしています）。 FF、Chrome、Safariで正常に動作します。ここで不透明度フィルタを使用すると、css：after擬似要素に関するInternet Explorerの問題
はHTMLです：
ここ<html>
<head></head>
<body>
<div id="demo"></div>
</body>
</html>
があるCSS：link text
今IEの不透明度フィルターを追加します。IEで
#demo {
background-color: #333;
height: 100px;
position: relative;
width: 100px;
}
#demo:after {
content: ' ';
height: 0;
position: absolute;
width: 0;
border: 10px solid transparent;
border-top-color: #333;
top: 100%;
left: 10px;
}
実行して、ここでの画像のように見える結果を参照してください：＃demoにすると、このようになり、再びIEで実行します：
#demo {
background-color: #333;
height: 100px;
position: relative;
width: 100px;
filter: alpha(opacity=50);
}
不透明フィルタは機能しますが、divの下部にある三角形は消えています。 他のすべてのブラウザで同じことがうまく機能します（唯一の違いは、IE固有の「フィルタ：アルファ（不透明度= 50）」の代わりに「不透明度：0.5」を使用する必要があるということです）
誰これが起こっていると、それを回避する方法は？
ありがとうございました。
ありがとう、レックス。私は実装を変更し、三角形を描く代わりに：afterの代わりに二番目のdivを使用しました。 –