兼容ie8 rgba()用法
今天遇到了一个问题,要在一个页面中设置一个半透明的白色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()用法的更多相关文章
- 兼容ie8 rgba()用法 滤镜filter的用法
原文 http://blog.csdn.net/westernranger/article/details/40836861 今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不 ...
- css 兼容ie8 rgba()用法
今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1); 但是要兼容到 ...
- backgroud背景色样式兼容ie8 rgba()用法
今天遇到了一个问题,要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1);但是要兼容到i ...
- 兼容ie8 rgba()写法
background: rgba(255,255,255,.1); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#1 ...
- background:rgba() 兼容ie8 用法
background: rgba(255,255,255,.1);//火狐,谷歌等 filter:progid:DXImageTransform.Microsoft.gradient(startCol ...
- 一个小方法解决RGBA不兼容IE8
原网页http://blog.csdn.net/leihope_/article/details/70158902 要在一个页面中设置一个半透明的白色div.这个貌似不是难题,只需要给这个div设置如 ...
- Css实现透明效果,兼容IE8
Css实现透明效果,兼容IE8 >>>>>>>>>>>>>>>>>>>>> ...
- 兼容ie8总结
最近做了个兼容ie8的项目,把遇到的一些坑总结一下,欢迎大神指正,共勉. 一. js相关 1. 关于库的引用 jquery只能引用1.x的版本,swiper只能引用2.x的版本. 2. 动态生成的d ...
- 换工作之后需要兼容ie8的我
以下是我ie8踩得坑,总结了一下,以免以后会遇到,虽然有的度娘也能搜到但是偶尔看看自己的文章也能学到很多(后续如有添加继续补上) 1,ie8 input框建议不要使用line-height去撑高度,在 ...
随机推荐
- 随便翻翻qcon 2014
随便翻了翻QCon 2014的ppt,土人看看最新的成果: 基本感受: 1. 高大上公司比如阿里,腾讯啥的已经挺过第一轮,已经重构重构再重构了,整个架构不能说成熟,但是可以说可用了 2. 创业公司或者 ...
- SpringMVC无法获取请求中的参数的问题的调查与解决(2)
由于Request的getInputSteam()一旦获取一次后,就再也无法获取了 在实际项目中导致下面的问题: 1,多个拦截器,Filter都需要从InputStream中拿数据的情况无法处理: 2 ...
- 总结一些关于操作数据库是sql语句还是存储过程问题
总结一些关于操作数据库是sql语句还是存储过程问题 程序中,你跟数据的交互,需要向数据库拿数据.更改数据库的数据等,这些操作,本身不是程序完成的,而是程序发命令给数据库去做的,不管是通过sql语句方式 ...
- CVPR 2007 Learning to detect a salient object
Dataset: MSRA A&B are introduced in this paper. A conditional Random Field based method was prop ...
- 【java基础学习二】 数组相互转换,转成用逗号隔开的字符串等
/** * int[],Integer[],List,List<Integer>,HashSet<Integer>相互转换,转成用逗号隔开的字符串 */ public stat ...
- Android之官方下拉刷新控件SwipeRefreshLayout
SwipeRefreshLayout 是在V4包里面,首先要先导入V4包,最新的V4包里面才有这控件 首先是布局 <android.support.v4.widget.SwipeRefreshL ...
- linux+php+apache web调用python脚本权限问题解决方案
lamp : linux + apache + mysql + php 在上篇随笔中linux+php+apache调用python脚本时出现的问题的根本原因是:apache运行时使用的apache用 ...
- js中原型的概念
- 关于使用READ TABLE语句的几点注意事项
原文地址 http://www.dlsap.com/thread-34-1-1.html 1. 如果使用READ TABLE语句来读取内部表数据,而不是简单看返回值判断是否存在,那么在使用REA ...
- 写css时要注意数字的浮动方向
写css时要注意数字的浮动方向 当数字位数增加时他的方向才是正确的 text-align:right;padding-right:29px;