<=IE8 的 CSS3 有效 'opacity'

Question

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

基本上，我们有一个经过过滤的团队成员列表(每个人的照片下方都有姓名/电子邮件)，将超出范围的成员放在末尾并略微褪色(不透明度: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. */
}