美文网首页
css:让ie8支持rgba最简单方案!

css:让ie8支持rgba最简单方案!

作者: 云桃桃 | 来源:发表于2018-08-15 17:41 被阅读110次

    在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以下的兼容处理。

    相关文章

      网友评论

          本文标题:css:让ie8支持rgba最简单方案!

          本文链接:https://www.haomeiwen.com/subject/mqwwbftx.html