css - 半透明的 IE 解决方法

Question

为了在 IE9 之前的版本中显示以下 CSS，应该采取什么解决方法：

background-color: hsla(182, 44%,76%,.5);

Answer 1

对于透明元素，您有更多方法。

对于 IE ->

filter: alpha(opacity=40);  
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);  
/* above line works in IE6, IE7, and IE8 */  
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=40)";  
/* above line is IE8 only */ 

对于所有浏览器：

opacity: .7;  

但它们对所有元素都是透明的，如果您只需要透明任何颜色，例如背景，您必须使用 2 个函数rgba 或hsla它们的示例：

支持：（Firefox 3+、Opera 10.1+、Chrome 2+、Safari 3.1+）

#rgba {  
    background: rgba(98, 135, 167, .4);  
}  

但是 IE9 只支持所有版本的 IE 并且所有浏览器都支持 css3

#hsla {  
    background: hsla(207, 38%, 47%, .4);  
}  

Answer 2

您可以使用 Microsoft 专有的“过滤器”之一来执行此操作：

background:transparent;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7FA7DBDD,endColorstr=#7FA7DBDD); 
zoom: 1;

十六进制值按 ARGB 顺序排列。因此，将您的颜色转换为 RGB 十六进制值，（#A7DBDD在这种情况下）并将不透明度放在前面（0.5 是 7F 十六进制），如下所示：#7FA7DBDD

当然，这最好在 IE 特定样式表中完成，可能使用条件注释。

Answer 3

使用具有纯色的单独 dom 元素并设置不透明度......它会工作得很好:)

.bg { 背景：#000; 过滤器：阿尔法（不透明度= 50）；不透明度：0.5；}