rgba语法:
  rgba(0, 0, 0,0.5);
  第一个参数:R 红色(0-255)
  第二个参数:G 绿色(0-255)
  第三个参数:B 蓝色(0-255)
  第四个参数:透明度(0-1)
使用rgba指定颜色的好处是:任何位置的颜色,使用rgba指定,都可以通过设置第四个参数来调整透明度。不仅仅可以设置背景色的透明度。
使用rgba指定背景透明和使用opacity指定背景颜色的透明度的区别:
  1、使用opacity指定背景颜色的透明度时,其内容也一起被设置透明度,导致内容模糊。如果不想内容模糊,只能如下处理:
  (单独设置一个元素做背景透明设置,其内容反而不在它内部)
  <div class="bg">
  </div>
  <div class="bg-content">
    <p>我是bg的后代元素,我不想我的前景有任何透明!怎么办?</p>
  </div>
  2、使用rgba指定背景颜色,可以通过调整最后一个参数值小于1来设置背景透明,而不会影响其内部的元素透明度

css3整理--rgba的更多相关文章

  1. 使用IE滤镜实现css3中rgba让背景色透明的效果

    让背景透明,听上去不是挺容易的么? 让背景色透明,很容易想到opacity,要兼容IE的话只要加上filter:alpha(opacity=?)就行了,OK,看看这个例子. html: <div ...

  2. css3整理-方便查询使用

    最近详细地研究了CSS3的相关内容,并整理了这个文档,方便以后查询使用,分享给大家. 案例代码大家可以下载参考下:https://gitee.com/LIULIULIU8/CSS3 1.边框属性bor ...

  3. CSS3 之 RGBa 可透明颜色

    在 CSS3 中,增加了一个 opacity 属性,允许开发者设置元素的透明度,现在 opacity 已被主流的现代浏览器支持,但 opacity 会把被设置的元素及其子元素同时设置为同一个透明度,这 ...

  4. CSS3:RGBA的使用方法

    1.说明 此色彩模式与RGB相同,只是在RGB模式上新增了Alpha透明度. RGBA(R,G,B,A) 2.取值 R: 红色值,正整数值的取值范围为:0 - 255,百分数值的取值范围为:0.0% ...

  5. 关于css3的rgba

    在rgba之前,我们应该知道rgb.它就是红色R+绿色G+蓝色B.那rgba是什么?简单的说就是在rgb的基础之上加上一个通道alpha.他的语法如下: r    红色值.正整数(0~255) | 百 ...

  6. Css3颜色值RGBA得表示方式

    RGBA(R,G,B,A) 取值 R:红色值.正整数 | 百分数 G:绿色值.正整数 | 百分数 B:蓝色值.正整数 | 百分数 A:Alpha透明度.取值0~1之间. 说明: RGBA记法. 此色彩 ...

  7. css3整理--text-shadow

    text-shadow语法: text-shadow:[颜色(Color) x轴(X Offset) y轴(Y Offset) 模糊半径(Blur)],[颜色(color) x轴(X Offset) ...

  8. css3整理--box-shadow

    box-shadow语法:(想法:用阴影来做边框,就不会出现动态改变边框宽度而产生的重排问题) 对象选择器{box-shadow:投影方式 X轴偏移量 Y轴偏移量 阴影模糊半径 阴影扩展半径 阴影颜色 ...

  9. 【CSS3】rgba与opacity

    RGBA 语法 R:红色值.正整数 | 百分数 G:绿色值.正整数 | 百分数 B:蓝色值.正整数| 百分数 A:透明度.取值0~1之间 为什么要用RGBA而不用opacity 因为在项目中需要用到一 ...

随机推荐

  1. 在js中 把 json对象转化为String对象的方法

    方法1: 使用js的扩展方法 ** * json对象转字符串形式 */ function json2str(o) { var arr = []; var fmt = function(s) { if ...

  2. C#网络编程之Http请求

    本片篇分享简单介绍C#中的Http请求,前几天帮朋友的项目封装ApiHelper,我粗糙的结果就如下,想想我真的是差的太远了.还有一位架构师也在封装这个Helper , 所以最后的结果当然是使用大牛的 ...

  3. js 原型链(转)

    1.1 理解原型链 JavaScript中几乎所有的东西都是对象,我们说数组是对象.DOM节点是对象.函数等也是对象,创建对象的Object也是对象(本身是构造函数),那么有一个重要的问题:对象从哪里 ...

  4. spark1.4配置安装

    https://segmentfault.com/a/1190000004508993

  5. 【玩转Golang】slice切片的操作——切片的追加、删除、插入等

    一.一般操作 1,声明变量,go自动初始化为nil,长度:0,地址:0,nil func main(){ var ss []string; fmt.Printf("length:%v \ta ...

  6. LinuxMint系统下Gate One的安装指南

    1. Gate One简介 前面有两个随笔介绍过开源软件tty.js和wetty在Linux的安装.Tty.js和wetty都是采用Node.js实现的开源Web-based ssh.今天来介绍另一个 ...

  7. mac osx voice over的使用

    mac下的filezilla是一个很奇葩的应用,奇葩在哪?有一次我不知道怎么操作的,把filezilla搬到到了窗体顶部,结果被mac的菜单栏挡住了标题栏,然后再也无法移动窗体了,以下是我为了移动它做 ...

  8. 在阿里云创建子域名,配置nginx,使用pm2部署node项目到ubuntu服务器

    配置域名 在阿里云找到主域名 进入主域名之后,右上角添加解析,添加子域名, 记录类型选择cname,主机记录填写子域名的名称,记录值为主域名,至此阿里云已经配置好了. 检查nginx安装 首先检查服务 ...

  9. eclipse 运行springboot项目

    一:当在eclipse启动spring boot项目时出现问题: 错误: 找不到或无法加载主类 com.example.demo.DemoApplication 解决办法: 1,通过cmd命令行,进入 ...

  10. Android 虚拟键盘弹出把底部栏顶上去的解决办法

    在AndroidManifest中使用ActivityGroup的activity中加上:android:windowSoftInputMode="adjustPan"