(我的博客网站中的原文:http://www.xiaoxianworld.com/archives/285,欢迎遇到的小伙伴常来瞅瞅,给点评论和建议,有错误和不足,也请指出。)

rgba()函数可以用来设置透明的颜色,元素的背景啊,边框啊等等。rgba的含义,r代表red,g代表green,b代表blue,红绿蓝是三原色。所有颜色都可以由这三种颜色拼合而成。a代表透明度。比如rgba(255,255,255,0.1)就是透明度为0.1的白色。

在现代浏览器中是支持rgba的。但是在ie8等古董级浏览器中是不支持rgba的,但是如果客户要求页面兼容到ie8呢,切一个半透明的png24背景吗?或者给ie8设置一个其他的颜色?前者明显很低级,后者效果又不好。怎么解决呢,别忘了ie的透明滤镜filter啊。

直接贴代码:
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7F000000,endColorstr=#7F000000);

参数解释:

startColorStr和endColorStr的值#7F000000,

前两位是十六进制的透明度,也就是透明值为0.5,

后面六位是十六进制的颜色000000(黑色),如果是白色,就写成ffffff。

rgba 和IE下filter数值的转换

用这种方法,ie8也能兼容rgba了,非常实用的小技巧。

实际使用时,可以加在条件注释中,只对ie8起作用。

【学习】ie8支持rgba()透明度颜色的更多相关文章

  1. 真~让IE8支持background: rbga; ,IE8下兼容rgba颜色的半透明背景

    IE8下兼容rgba颜色的半透明背景 这样的标题在百度和google搜索下很多篇文章,讲解IE8下兼容rgba的. 这些文章全部都是使用IE下的filter来使元素透明,但是这个里面会有bug. 它们 ...

  2. IE兼容rgba()透明度

    一般浏览器的背景透明度可以直接设置 background:rgba(0,0,0,.5); -webkit-background:rgba(0,0,0,.5); -o-background:rgba(0 ...

  3. IE8支持HTML5的占位符placeholder

    /*IE8支持placeholder占位符*/ if( !('placeholder' in document.createElement('input')) ){ $('input[placehol ...

  4. 让IE7 IE8支持CSS3 background-size属性

    简介 CSS3 新增的 background-size 是一个很有用的属性,用于定义背景图片的尺寸,有了这个属性,你就可以任意指定背景图片的大小.其中最常用的值应该要数 cover 了,该值能让背景图 ...

  5. 让IE8支持HTML5及canvas功能!chart.js图表绘制工具库IE8上兼容方案

    第一步,我们加上对html5的支持. <!--[if IE]> <script src="/public/html5.js" type="text/ja ...

  6. 让IE8支持HTML5及canvas功能!

    微软出的IE9支持HTML5,但因为不支持XP系统,暂时我还用不了. 即使能用,现阶段如果开发HTML5页面,并考虑到兼容性问题的话,恐怕也得让自己的界面支持IE6-8吧. 首先,需要让IE支持HTM ...

  7. 让ie8支持 placeholder 属性

    一.  ie8支持 placeholder 属性 /* * ie8支持 placeholder 属性 */ $(function(){ if( !('placeholder' in document. ...

  8. 让IE8支持html5中的video标签

    这是一篇综合几个前辈的解决方案. 使用video的时候,要遇到的问题. ①不兼容ie9及其以下版本 在<head>里添加两行, 参考张鑫旭前辈的博客,但是在ie8中薄播放. <!-- ...

  9. IE7&IE8不支持rgba的方法

    使用滤镜功能 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#BF000000,endColorstr=#BF0000 ...

随机推荐

  1. 安装Window下Jenkins

    之前没接触过持续集成工具,之前只是了解了下自动化部署,最近一直在看自动化集成这块,发现要学的东西好多好多,可能在小公司用的不多,但如果在大公司,如果每个项目都要手动build.deploy的话那也太耗 ...

  2. 如何使用phpstudy本地搭建多站点(每个站点对应不同的端口)

    到http://phpstudy.net/a.php/208.html下载phpstudy 1.装完phpstudy后,(假设安装在D盘,安装后开启服务) 在D:\phpStudy\WWW\路径下创建 ...

  3. Spring Ioc DI 原理

    IOC(DI):其实这个Spring架构核心的概念没有这么复杂,更不像有些书上描述的那样晦涩.Java程序员都知道:java程序中的每个业务逻辑至少需要两个或以上的对象来协作完成,通常,每个对象在使用 ...

  4. Brotli、Deflate、Zopfli、LZMA、LZHAM、Bzip2六种无损数据压缩性能比较

    这里比较了六种数据压缩算法,结果表明Brotli算法会代替普遍使用的Deflate算法.分别用Canterbury compression corpus,web contentcorpus,和 enw ...

  5. HTML5新增web存储方式

    客户端存储数据的两个对象为: 两个对象在使用方式没有任何区别,唯一的不同点蚀储存数据 的有效时间 ①localStorage - 没有时间限制的数据存储 除非手动删除,否则数据将一直保存在本地文件: ...

  6. Java项目生成Jar文件

    打开 Jar 文件向导 Jar 文件向导可用于将项目导出为可运行的 jar 包. 打开向导的步骤为: 在 Package Explorer 中选择你要导出的项目内容.如果你要导出项目中所有的类和资源, ...

  7. 微信小程序中发送模版消息注意事项

    在微信小程序中发送模版消息 参考微信公众平台Api文档地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/notice.html#模版消息管理 此参考地址 ...

  8. Python 的笔试题

    其实大多数说学习Python 是纯兴趣,真的我不信,许多人已经工作了,没有那么多时间搞自己的纯兴趣了,都会为了生活奋斗,可以说转行来学python 就是未来加薪,当然,小编现在也快要准备工作了,所以也 ...

  9. Laravel 源码解读系列第四篇-Auth 机制

    前言 Laravel有一个神器: php artisan make:auth 能够快速的帮我们完成一套注册和登录的认证机制,但是这套机制具体的是怎么跑起来的呢?我们不妨来一起看看他的源码.不过在这篇文 ...

  10. eclipse安装java ee插件方法步骤

    1.本人以前使用的MyEclipse进行Javaweb开发,但是后来由于myeclipse实在太臃肿,经常在运行的过程中不流畅 (可能电脑内存也不是太高吧)   !所以坚决换用eclipse,但是问题 ...