您的位置:首页 > Web前端 > CSS

IE8不兼容RGBA的解决方法

2018-03-21 16:31 197 查看
在页面中给一个元素添加透明背景什么的最简单了,只需要这样写:background:rgba(255,255,255,0.3)    (看好你呦)你以为大功告成了吗?
打开你的IE浏览器(黑线满脸),什么???IE8没有用,但是boss让兼容IE8(泪流满脸)
搜索一番后找到了解决方法如下:
先说说rgba的含义:
r代表red(红),g代表green(绿),b代表blue(蓝),是三原色,其他的颜色都是这三种颜色混合而成。a代表透明度,取值为0-1,0为全透明,1为不透明。

在ie8中设置透明效果就要费点脑子了。从大神那里得知可以使用ie的filter来解决这个问题,css代码如下:

background: rgba(255,255,255,0.1);    //现代浏览器
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff);    //IE8其实第二句话的意思本来是用来做渐变的。两个颜色都设置成了相同的颜色看起来就是一个颜色了

大家注意,这个颜色“#19ffffff”是由两部分组成的。

第一部是#号后面的19 。是rgba透明度0.1的IEfilter值。从0.1到0.9每个数字对应一个IEfilter值。对应关系如下:


第二部分是19后面的六位 。这个是六进制的颜色值。要跟rgb函数中的取值相同。比如rgb(255,255,255)对应#ffffff;都是白色。到这里,rgba的用法就可以兼容IE8了。以前没有写博客的习惯,所以很多知识点没有记录,用的时候才发现自己已经忘了,还要靠搜索。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  css IE8