background-color: rgba(0,0,0,0);
css3 rgba 即在原本3原色的基础上增加了alpha(透明度)通道，该属性的兼容性如下：
| 类型 | Internet Explorer | Firefox | Chrome | Opera | Safari |
|---|---|---|---|---|---|
| 版本 | (×)IE6 | (√)Firefox 3.0.10 | (√)Chrome 2.0.x | (√)Opera 9.64 | (√)Safari 4 |
| (×)IE7 | |||||
| (×)IE8 | |||||
| (√)IE9 |
IE家族只有9以后的版本支持该属性；
有童鞋可能对rgba的使用环境不大清楚，但肯定熟悉opacity属性。opacity实现了元素的alpha通道，如opacity:0.5表示50%的透明度，但opacity不止实现了元素的透明度，同时包括元素的子元素也有该透明度，比如
将使整个节点树显示为50%的透明灰度；而rgba可以直接表示颜色属性和透明度，比如
前三个参数是颜色的RGB表示法，如0,0,0就表示黑色，最后一个参数是alpha值，和opacity具有相同的意思，但这次的设置是使<div>的背景色变为50%的透明灰度，内部节点和内容依然是不透明的。
对于支持该属性的浏览器可以直接使用：
-
.class {
-
background : rgba ( 0 , 0 , 0 , 0.75 ) ;
-
}
针对IE6-8的hack为：
-
.class {
-
filter :progid :DXImageTransform .Microsoft.gradient (startColorstr = #BF000000 ,endColorstr = #BF000000 ) ;
-
}
用到了IE自家的filter滤镜。IE虽然不支持很多标准，但自己也提供了很多有意思的功能，比如filter滤镜、expression行内表达式等。相关的参数我不再解释，自己查查。提示两点：
1.startColorstr和endColorstr的值由两部分组成：前两位是alpha值，后六位是颜色值，都是十六进制表示法；可以用x=a*255(其中x是表达式的16进制值，a表示alpha值如0.5)；
2.因为IE5+都是支持filter的，所以可以这样写：
-
-
<!--[if IE 8]>
-
<style>
-
.class{-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#BF000000,endColorstr=#BF000000)";}
-
</style>
-
<![endif]-->
如果写在css里，因为IE9+既支持filter，又支持rgba，所以会看到两者叠加的效果。
RGBa是一种在CSS中声明包含透明效果的颜色的方法，通过RGBa我们可以将一个元素设置为透明，而不会影响其子元素。但是并非所有的浏览器支持RGBa的背景色，其中用户颇多的老版本IE浏览器就不支持，好在IE浏览器支持条件注释，我们可以抛弃RGB并使用IE浏览器的一个私有CSS滤镜来实现同样的效果。上代码：
<!--[if IE]>
<style type="text/css">
.color-block {
background:transparent;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4B7D0000,endColorstr=#4B7D0000);
zoom: 1;
}
</style>
<![endif]-->
点击查看在线演示
DXImageTransform.Microsoft.gradient滤镜里的startColorstr参数值是#AARRGGBB形式的，其中的AA是代表不透明度的十六进制，00表示完全透明，FF就是全不透明，化成十进制的范围就是0~255，剩下的RRGGBB就是颜色的十六进制代码。例子中background: rgba(125, 0, 0, .3);表示的是30%不透明度的红色背景。如何把30%的不透明度转换成十六制呢？很简单，先计算#AA的的十进制x，x/255 = 3/10，解得x=3*255/10，然后再把x换算成十六进制，约等于4B。
RGBa颜色还可以用于border，不过，不同的浏览器对于border的RGBa支持不太一样，不过唯一的不同是，Firefox在border的拐角处会出现叠加，比如透明度是0.4，那么在Firefox中，四个角的透明度会变成0.8，而支持RGBa的非FF浏览器不会出现这种情况。
/* older safari/Cｈrome browsers */
-webkit-opacity: 0.5 ;
/* Netscape and Older than Firefix 0.9 */
-moz-opacity: 0.5 ;
-khtml-opacity: 0.5 ;
opacity: .5 ;
filter: alpha(opacity=50) ;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)" ;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50) ;