opacity:1.0可以设置透明度,但是其子元素都会带有同样的透明度,那么我们可以换一种写法:background:rgba(0,0,0,0.5)
rgba呢,就是red+green+blue+alpha,也就是红+绿+蓝+Alpha透明的颜色。
黑色半透明:
.main{
width: 100px;
height: 100px;
background: rgba(0, 0, 0, 0.5);
}
白色半透明:
.main{
width: 100px;
height: 100px;
background: rgba(225, 225, 225, 0.5);
}
但是IE8及其以下是不兼容rgba的,如果需要兼容IE
我们可以使用IE渐变滤镜,可以使所有主流浏览器下元素都实现50%透明的黑色背景:
background:rgba(0,0,0,0.5);
filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);