<=IE8 的 CSS3 有效“不透明度”

Question

我正在努力确保我的公司网站是 HTML5/CSS3 有效，但我遇到了一小段 CSS 的问题。

基本上，我们有一个经过过滤的团队成员列表（每个人的照片，下面都有姓名/电子邮件），超出范围的成员放在最后并略微褪色（opacity: 0.3;）。但是，由于 IE8（及之前）比较特殊，我使用了以下 -

filter: alpha(opacity=30);

然而，这导致了一个验证错误“Parse Error opacity=30)”，所以我做了一些搜索并将其替换为 -

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

这次没有错误，但我确实收到了警告 - “Property -ms-filter is an unknown vendor extension”

有没有人知道一种 CSS3 有效的应用 opacity 的方法，它向后兼容 IE8（即没有错误或警告）？谢谢。

Answer 1

一种方法是简单地在不透明度旁边添加一个额外的效果。这样，不呈现 opacity 属性的浏览器仍然能够区分超出范围的团队成员：

selector {
    background: #dfdfdf;    /* New property, light grey background. */
    opacity: 0.3;           /* Old existing property, no validation warnings. */
}