IE8浏览器的rgba

IE8浏览器的rgba

       在一次开发中，发现要根据页面的一个按钮弹出一个注册框，并拥有黑色的半透明背景，自然而然的用上了CSS3：

rgba(red, green, blue, alpha);

       其中，前面三个参数为0~255的数字，表示 红(red)、绿(green)、蓝(blue) 三大基本颜色的深度， alpha为0.1~1的小数，表示 不透明度 ，即0为全透明，1为不透明，这个方法能很快捷地实现背景色或者文字颜色的透明操作。

       然而IE9以下的老旧浏览器不能支持CSS3，显示结果为：

       黑色的半透明背景并没有显现，因此必须得求得一个方法来实现透明的设置。

       网上的教程攻略说明也不少了，最多使用的方法即是IE浏览器独有的 filter 滤镜的css样式：

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000, endColorstr=#7f000000);

       该滤镜是用以解决渐变色的滤镜操作的，不过因为咱们只需要要操作的仅仅只是同一个颜色的透明度问题，因此保持 startColorstr 和 endColorstr 相同即可。

       另外这里的 #7f000000，#7f代表的是透明度，000000是以十六进制表现的颜色，这些值都是从 000000（完全透明/黑色） 到 ffffff（完全不透明/白色） 下面是常用透明度的对应表：

透明度	filter
0.1	19
0.2	33
0.3	4C
0.4	66
0.5	7F
0.6	99
0.7	B2
0.8	C8
0.9	E5

       所以相对应的代码为

.mask {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .5);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000, endColorstr=#7f000000);
}

       类名为 .mask 的背景层为透明度为0.5的黑色背景色。