今天遇到了一个问题,要在一个页面中设置一个半透明的白色div。这个貌似不是难题,只需要给这个div设置如下的属性即可:

background: rgba(255,255,255,.1);

但是要兼容到ie8。这个就有点蛋疼了。因为ie8不支持rgba()函数。下面我们总结一下rgba()函数的含义。

rgba的含义,r代表red,g代表green,b代表blue,红绿蓝是三原色。所有颜色都可以由这三种颜色拼合而成。a代表透明度。比如rgba(255,255,255,0.1)就是透明度为0.1的白色。在现代浏览器中是支持rgba的。但是在ie8等古董级浏览器中是不支持的rgba的,ie8只能勉强支持rgb()函数(即去掉了透明度,只能表示颜色)。

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

<span style="white-space:pre">	</span>background: rgba(255,255,255,.1);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff);

第二句话的意思就是当上一行的透明度不起作用的时候执行。这句话的意思本来是用来做渐变的。但是这个地方不需要渐变。所以两个颜色都设置成了相同的颜色。

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

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

第二部分是19后面的六位 。这个是六进制的颜色值。要跟rgb函数中的取值相同。比如rgb(255,255,255)对应#ffffff;都是白色。

到这里,rgba的用法就可以兼容IE8了。

兼容ie8 rgba()用法的更多相关文章

  1. 兼容ie8 rgba()用法 滤镜filter的用法

    原文  http://blog.csdn.net/westernranger/article/details/40836861 今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不 ...

  2. css 兼容ie8 rgba()用法

    今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1); 但是要兼容到 ...

  3. backgroud背景色样式兼容ie8 rgba()用法

    今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1);但是要兼容到i ...

  4. 兼容ie8 rgba()写法

    background: rgba(255,255,255,.1); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#1 ...

  5. background:rgba() 兼容ie8 用法

    background: rgba(255,255,255,.1);//火狐,谷歌等 filter:progid:DXImageTransform.Microsoft.gradient(startCol ...

  6. 一个小方法解决RGBA不兼容IE8

    原网页http://blog.csdn.net/leihope_/article/details/70158902 要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如 ...

  7. Css实现透明效果,兼容IE8

    Css实现透明效果,兼容IE8 >>>>>>>>>>>>>>>>>>>>> ...

  8. 兼容ie8总结

    最近做了个兼容ie8的项目,把遇到的一些坑总结一下,欢迎大神指正,共勉. 一. js相关 1.  关于库的引用 jquery只能引用1.x的版本,swiper只能引用2.x的版本. 2. 动态生成的d ...

  9. 换工作之后需要兼容ie8的我

    以下是我ie8踩得坑,总结了一下,以免以后会遇到,虽然有的度娘也能搜到但是偶尔看看自己的文章也能学到很多(后续如有添加继续补上) 1,ie8 input框建议不要使用line-height去撑高度,在 ...

随机推荐

  1. 加载AssetBundle方法

    先介绍一种常用的加载AssetBundle方法 using UnityEngine; using System.Collections; using System.IO; public class L ...

  2. redis常用总结

    1. 使用redis有哪些好处? (1) 速度快,因为数据存在内存中,类似于HashMap,HashMap的优势就是查找和操作的时间复杂度都是O(1) (2) 支持丰富数据类型,支持string,li ...

  3. GET与POST的区别

    转自http://blog.csdn.net/darxin/article/details/4944225#comments HTTP请求的GET与POST方式的本质区别可以参考hyddd在<浅 ...

  4. 44、NLP的其他分词功能测试

    1. 命名实体识别功能测试 @Test public void testNer(){ if (NER.create("ltp_data/ner.model")<0) { Sy ...

  5. 35、重新复习html与css(1)

    1.html与css的结合方式 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "ht ...

  6. maven本地安装jar包同时生成pom文件

    maven 本地安装jar包:mvn install:install-file -Dfile=本地路径/ojdbc12.jar -DgroupId=com.oracle -DartifactId=oj ...

  7. Delphi控制Excel输出上标示例

    直接上代码吧,这个示例在Excel中输出一个M2: unit FfrmMain; interface uses Winapi.Windows, Winapi.Messages, System.SysU ...

  8. python2.6.6安装Image模块

    python2.6.6安装Image模块1.下载Image模块源码地址:http://www.pythonware.com/products/pil/index.htm2.加压文件#tar zxvf ...

  9. Python 2.7_初试连接Mysql查询数据导出到excel_20161216

    由于每天到公司都需要先执行一遍检测操作,观察数据是否导入完整,今天想到能否自动连接Mysql执行SQL并导出数据,每天到公司直接查看excel文件即可 时间紧,代码初次试验,边摸索边学习吧. xlsx ...

  10. Python实现插件机制——自动import一个目录下的所有.py文件

    假设有这样一个目录结构: /src          main.py          /plugins                __init__.py                a.py  ...