在ie9以及以上可以使用.pop{background:rgba(0,0,0,.5)}这样的格式来对一个元素本身加透明度,ie8以下怎么处理呢?ie8以下有自带的滤镜渐变效果,所以用滤镜的方式来写。
完整兼容写法,如下:
.pop{background:rgba(0,0,0,.5);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000)\9;}
主要说下startColorstr,endColorstr后面的内容,前面那一长串自行百度,在此不描述:
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000)\9
-
#后面紧挨的2位是透明度值,取值范围是00-FF,下面有对应的计算方法:1.255*需要的透明度值(范围:0~1);2.对该值取整,然后转为16进制。我这里是7F,所以是0.5透明度的元素。
255*透明度.png
转16进制.jpg
- 透明度后面6位数字是RGB的颜色值,这里都是000000,纯黑色。
- \9是css hack写法,针对ie8以及ie8以下的兼容处理。
网友评论