概念

所谓RGBA颜色,就是RGB三原色加ALPHA。在给背景加入颜色的同一时候。提供透明度特性。

用法

background:rgba(90,90, 54, 0.5);

支持情况

Firefox 3.0.5

支持

Safari

支持

Google Chrome

支持

IE

Fuck!

!!!

IE怎么办

在做弹出层遮罩的时候。我们经经常使用到filter:alpha(opacity=50)。这个就是解决方式吗?试试看吧。当你发现文本所有继承了半透明属性。

不得不说,IE在滤镜上还是花了非常多功夫的。我们能够使用filter:progid:DXImageTransform.Microsoft.Gradient ,对,这个是渐变滤镜,可是能够实现背景透明这个滤镜有两个选项,一个是startColorStr,另外一个就是end。关于选项的值,跟RGBA非常类似的,仅仅只是从10进制改成了16进制。而且ALPHA放到了前面,

startColorStr = #00ffeedd , 00就是透明度,剩下的就是16进制的RGB颜色。

实例:

filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#77000000,endcolorstr=#77000000);

RGBA与半透明背景的更多相关文章

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

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

  2. Framework 7 之 给Picker Modal 添加半透明背景

    官网的效果图如下: 效果图如下: 我们需要在显示下面浮层的时候显示后面的半透明背景,Framework 7 里面默认有个半透明背景,如下图: 解决方案: 1.在</body>标签之前添加& ...

  3. 兼容ie的半透明背景颜色过滤器,会影响事件的触发.

    兼容ie的半透明背景颜色过滤器,会影响事件的触发.

  4. 如何使用纯js实现一个带有灰色半透明背景的弹出框

    原文如何使用纯js实现一个带有灰色半透明背景的弹出框 // 加入透明背景 var body = document.body;var backgroundDiv = document.createEle ...

  5. IE8下兼容rgba颜色的半透明背景

    在工作中做一个图片半透明遮罩时发现在IE8下不兼容 一查再知道IE8不支持rgba颜色,再搜搜兼容性方法,没想到这么快就解决了. 先说说rgba的含义: r代表red,g代表green,b代表blue ...

  6. 半透明背景(兼容IE)

    在CSS3中有rgba属性,可以很方便的实现背景透明,但对于IE家族来说却不是那么容易实现: FireFox.chrome.opera.safari 凡是对支持CSS3且支持W3标准的浏览器都可以现实 ...

  7. 使用rgba设置输入框背景透明

    项目中遇到要求输入框的背景设置透明度,但文字不受影响,如下图 输入框使用input标签 <input ref="searchText" type="search&q ...

  8. div半透明背景,文字不透明

    background: rgba(255, 255, 255, 0.8) !important; /* IE无效,FF有效 */ background: #fff; filter: alpha(opa ...

  9. css3实现气泡效果的聊天框

    因为CSS3尚未形成标准,所以现行的浏览器对于css3支持不太一致,某些特性需要加上浏览器前缀 css属性的浏览器前缀 前缀 渲染引擎 使用该引擎的浏览器 -khtml- KHTML Konquero ...

随机推荐

  1. bmp,jpg,png,tif,wmf,emf与eps图片格式转换

    wmf/emf是两种Microsoft Windows的图形文件格式.它是一个矢量图格式,但是也允许包含位图.本质上,一个WMF文件保存一系列可以用来重建图片的Windows GDI命令.在某种程度上 ...

  2. Camera图像处理原理及实例分析

    Camera图像处理原理及实例分析 作者:刘旭晖  colorant@163.com  转载请注明出处 BLOG:http://blog.csdn.net/colorant/ 主页:http://rg ...

  3. 用new和delete运算符进行动态分配和撤销存储空间

    測试描写叙述:暂时开辟一个存储空间以存放一个结构体数据 #include <iostream> #include <string> using namespace std; s ...

  4. ASP.NET MVC学习---(六)CRUD例子补充

    在之前,我们使用mvc做了一个crud的小例子 整个项目过程应该是能够很容易理解的 通过这个例子我们可以大概的了解mvc的基本使用方法 但是由于篇幅限制(还不如说自己懒不想写那么长...) 没有能够在 ...

  5. 配置php扩展memcache

    配置php扩展memcache 环境说明: 系统版本    CentOS 6.9 x86_64         软件版本    nginx-1.12.2        php-5.5.38       ...

  6. 错误:“The requested resource () is not available.”的处置

    做网页过程中,某页需要以新窗方式打开另一个网页,于是url是这样写: pages/test/transw/claimer.html 但是,点链接后网页提示 The requested resource ...

  7. 系统封装 如何修改别人的PE为己所用

    我们以修改"我心如水 WIN7PE_16.99.1 维护版.ISO"为例,整个ISO的核心文件就是这个BOOT.WIM,我们先把他提取出来. 然后用在本教程第一章学到的东西,用AI ...

  8. redis中的事务(版本2.6.16)

    一.命令支持 1.multi 开始事务 2.exec事务提交 3.取消事务discard 二.事务示例 1.示例 redis>set key1 20OKredis>mutilOKredis ...

  9. ubuntu12.04 下安装nodejs

    liunx里面安装nodejs我也找了非常多文章,貌似对非常多liunx新手来讲不是非常清楚,以下是我结合一些文章,亲自实践得到的安装步骤.同一时候还有大家关心的与seajs紧密相关的spm模块的安装 ...

  10. 【转】Intellij IDEA常用配置详解

    1. IDEA内存优化 先看看你机器本身的配置而配置. \IntelliJ IDEA 8\bin\idea.exe.vmoptions -------------------------------- ...