解决ie8下的rgba不兼容的问题

昨天遇到一个问题，要实现一个背景透明的效果，用CSS3用rgba()就能实现

background: rgba(0,0,0,.5);

因为要兼容的ie8 ie8不支持rgba() 函数 google找到了解决方法直接上代码

css

.opacity_bg_box{
    background:rgba(0,0,0,0.5);
    border-radius:5px;
    filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);
    width:200px;
    height:200px;
}

html

<div class="opacity_bg_box"></div>

rgba（） r 代表的是red g 代表的是green b代表的blue a代表的透明度所有颜色都可以由 rgb这三种颜色拼合而成 rgba(0,0,0,.5)就是透明度为0.5的黑色但是IE678不支持rgba() 但是IE提供了渐变过滤器也就是上面我们用到的filter 看一下如何实现透明度的

filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);

 ＃7F000000 

 7F代表的透明度 用的是16进度 平时我们可以直接在命令行中Math.floor(0.5 * 255).toString(16); 就能得到
 后面的6位就是我们的颜色值

给个链接 demo地址：http://www.zhangxinxu.com/study/201005/bg-color-opacity-demo.html filter详解： http://fancyoung.com/blog/css-background-transparency/ https://segmentfault.com/a/1190000002485299

xieshanshan / blog

ie8兼容 rgba #7

解决ie8下的rgba不兼容的问题