原网页http://blog.csdn.net/leihope_/article/details/70158902

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

background: rgba(255,255,255,0.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代码如下:

	background: rgba(255,255,255,0.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了。

一个小方法解决RGBA不兼容IE8的更多相关文章

  1. js调试记录,将客户的调试信息保存到服务器端的一个小方法。

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. IOS 应用 退出的一个小方法

    AppDelegate * app=(AppDelegate *)[[UIApplication sharedApplication]delegate]; UIWindow *window = app ...

  3. LNMP下安装phpmyadmin的一个小错误解决办法

    环境:ubuntu16.04 + nginx1.10.0 + php7.04 + mysql5.6 安装phpmyadmin之后tail nginx 的错误日志,提示以下: 2016/06/30 15 ...

  4. 屌炸天,像写代码一样写PPT,一个小工具解决

    此文已经废,请移步升级版博文: markdown写ppt (史上最全)

  5. springboot只能一个main方法解决办法

    pom.xml修改properties,增加这行 <start-class>com.eshore.main.SpringBootStarter</start-class> 或者 ...

  6. HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

    这篇文章主要介绍了HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法,需要的朋友可以参考下 HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面 ...

  7. 完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

    完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法   HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页 ...

  8. 前端页面兼容ie8解决方法

    一.通用兼容文件的引用: 1.HTML5标签兼容方案:html5shiv.js GitHub地址:https://github.com/aFarkas/html5shiv/ IE8不支持HTML5的新 ...

  9. 一行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

    行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10 2012-04-25 16:29:04| 分类: 学习 |字号 订阅 在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE ...

随机推荐

  1. WHU-1551-Pairs(莫队算法+分块实现)

    Description Give you a sequence consisted of n numbers. You are required to answer how many pairs of ...

  2. gnu-ucos 增加 bmp 位图显示

    昨天又下了点功夫弄了个在tft屏幕上显示bmp位图的. 我选择的是24位tft真彩測显示方式所以也要选择真彩色位图.网上给出的16位位图数组无法使用.在csdn上下载了2个制作工具,一个是c代码的,一 ...

  3. Android SDK update被墙

    1.输入命令:$ sudo gedit /etc/hosts 2.在打开的 /etc/hosts 在文件的末尾添加下面一句:74.125.237.1 dl-ssl.google.com

  4. ora-12541无监听的一种场景

    项目上突然出现无法连接Oracle数据库的情况,提示无监听程序. 现象: 查看 listener.ora配置无问题,用Net Configuration Assistant重建监听,NCA也处于假死状 ...

  5. 2016/2/25 onchange 应用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. android 自定义View开发实战(六) 可拖动的GridView

    1前言 由于项目需求,需要把项目的主界面采用GridView显示,并且需要根据模块优先级支持拖动图标(砍死产品狗).为此,自定义了一个支持拖拽图标的GridView.效果如下: 具体效果如上图 2 可 ...

  7. light oj 1205(数位DP)

    题目描述: 求给定区间中的回文数有多少个? 首先明确一点,如果一个数是回文数,那么给这个数两边加上相同的数,那么这个数还是回文数. 根据这点就可以进行递推了,p[start][end]=9*p[sta ...

  8. vue 随笔 vue 的属性和方法

    新建的项目中main.js是项目的入口文件 npm run dev 运行文件 npm run bulid  编译 属性与方法 每个Vue实例都会代理其 data 对象里所有的属性: var data= ...

  9. zoom和transform scale

    一.zoom zoom的字面意思是“变焦”,摄影的时候常用到的一个概念.对于web上的zoom效果,你也可以按照此概念理解.可以改变页面上元素的尺寸,属于真实尺寸. 在旧的web时代.*zoom: 1 ...

  10. asp.net mvc5 使用百度ueditor 本编辑器完整示例(三)在IIS中多个应用程序使用多个ueditor对象

    最近做了一个项目,要求同一类型的多个专业应用程序(网站),但是每个应用程序都需要调用各自当中的ueditor. 步骤: 一.在vs2013中设置每个专业的asp.net mvc 应用程序. 1.配置根 ...