今天遇到了一个问题,要在一个页面中设置一个半透明的白色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代码如下:

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;都是白色。

backgroud背景色样式兼容ie8 rgba()用法的更多相关文章

  1. 兼容ie8 rgba()用法

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

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

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

  3. css 兼容ie8 rgba()用法

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

  4. CSS3背景色透明(兼容IE8)

    标准浏览器通过rgba()实现背景色透明;IE8以下浏览器通过特有滤镜实现背景色透明. 代码如下: 1 /* IE8 */ 2 filter:progid:DXImageTransform.Micro ...

  5. 兼容ie8 rgba()写法

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

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

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

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

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

  8. 兼容IE8的flash上传框架"uploadify"自定义上传按钮样式的办法

    (uploadify版本:3.2.1 ) 因为公司业务的原因,所做的项目需要兼容IE8,因此做的上传插件无奈选择的是基于flash的uploadify. 由于是基于flash的,所以使用过程中,难以给 ...

  9. css样式设置图片半透明度,兼容IE8,火狐

    关于背景颜色透明的兼容浏览器的问题,一直是个问题,我所写的兼容IE8,和火狐,说是兼容所有浏览器我就没有测试,有兴趣的朋友可以自己测试下吧. background-color:white;filter ...

随机推荐

  1. ThinkPhp5.0_文件上传

    ===================================================================== 路径: F:\wamp\www\public\uploads ...

  2. 【开发技术】一些常用的网站[ios]

    http://www.cocoachina.com/   苹果开发中文网站 http://blog.csdn.net/totogo2010  容芳志的IOS专栏 http://code4app.com ...

  3. mybatis_SQL映射(4)鉴别器

    摘录自:http://blog.csdn.net/y172158950/article/details/17505739 鉴别器:有时一个单独的数据库查询也许返回很多不同(但是希望有些关联)数据类型的 ...

  4. 服务器大量的fin_wait1 状态长时间存在原因分析-1

    上文描述了在出现大量fin-wait-1出现的原因,占用的内存等,这里讲一下如何处理这种情况. 首先,fin发送之后,有可能会丢弃,那么发送多少次这样的fin包呢?fin包的重传,也会采用退避方式,在 ...

  5. js_4_函数

    js的函数是怎么定义的? function 函数名(形参1,......) { 函数体: return 返回值 :                                 //  可以没有返回 ...

  6. CDuiString和String的转换

    很多时候 难免用到CDuiString和string的转换. 我们应该注意到,CDuiString类有个方法: LPCTSTR GetData() const; 可以通过这个方法,把CDuiStrin ...

  7. There were X failed login attempts since the last successful login

    如题,开始玩Linux的人,每次登陆的时候,肯定会遇到这个提示,好担心系统被人攻破,那怎么把这些试探的IP抓出来,并屏蔽呢,今天就记录一下我的做法,供大家参考 其实这个问题已经在系统级别支持解决,目前 ...

  8. Linux指令--性能监控和优化命令相关指令

    原文出处:http://www.cnblogs.com/peida/archive/2012/12/05/2803591.html.感谢作者无私分享 性能监控和优化命令相关指令有:top,free,v ...

  9. JAVA中JPA的主键自增长注解设置

    JPA的注解来定义实体的时候,使用@Id来注解主键属性即可.如果数据库主键是自增长的,需要在增加一个注解@GeneratedValue,即: @GeneratedValue(strategy=Gene ...

  10. java 重写与重载

    一.方法重写: 参数列表必须完全与被重写方法的相同: 返回类型必须完全与被重写方法的返回类型相同: 访问权限不能比父类中被重写的方法的访问权限更低.例如:如果父类的一个方法被声明为public,那么在 ...