css3整理--rgba
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的更多相关文章
- 使用IE滤镜实现css3中rgba让背景色透明的效果
让背景透明,听上去不是挺容易的么? 让背景色透明,很容易想到opacity,要兼容IE的话只要加上filter:alpha(opacity=?)就行了,OK,看看这个例子. html: <div ...
- css3整理-方便查询使用
最近详细地研究了CSS3的相关内容,并整理了这个文档,方便以后查询使用,分享给大家. 案例代码大家可以下载参考下:https://gitee.com/LIULIULIU8/CSS3 1.边框属性bor ...
- CSS3 之 RGBa 可透明颜色
在 CSS3 中,增加了一个 opacity 属性,允许开发者设置元素的透明度,现在 opacity 已被主流的现代浏览器支持,但 opacity 会把被设置的元素及其子元素同时设置为同一个透明度,这 ...
- CSS3:RGBA的使用方法
1.说明 此色彩模式与RGB相同,只是在RGB模式上新增了Alpha透明度. RGBA(R,G,B,A) 2.取值 R: 红色值,正整数值的取值范围为:0 - 255,百分数值的取值范围为:0.0% ...
- 关于css3的rgba
在rgba之前,我们应该知道rgb.它就是红色R+绿色G+蓝色B.那rgba是什么?简单的说就是在rgb的基础之上加上一个通道alpha.他的语法如下: r 红色值.正整数(0~255) | 百 ...
- Css3颜色值RGBA得表示方式
RGBA(R,G,B,A) 取值 R:红色值.正整数 | 百分数 G:绿色值.正整数 | 百分数 B:蓝色值.正整数 | 百分数 A:Alpha透明度.取值0~1之间. 说明: RGBA记法. 此色彩 ...
- css3整理--text-shadow
text-shadow语法: text-shadow:[颜色(Color) x轴(X Offset) y轴(Y Offset) 模糊半径(Blur)],[颜色(color) x轴(X Offset) ...
- css3整理--box-shadow
box-shadow语法:(想法:用阴影来做边框,就不会出现动态改变边框宽度而产生的重排问题) 对象选择器{box-shadow:投影方式 X轴偏移量 Y轴偏移量 阴影模糊半径 阴影扩展半径 阴影颜色 ...
- 【CSS3】rgba与opacity
RGBA 语法 R:红色值.正整数 | 百分数 G:绿色值.正整数 | 百分数 B:蓝色值.正整数| 百分数 A:透明度.取值0~1之间 为什么要用RGBA而不用opacity 因为在项目中需要用到一 ...
随机推荐
- 随手记录一下 Vue 下来框搜索 select2 封装成vue
引入布局文件 <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css& ...
- org.in2bits.MyXls.XlsDocument 生成excel文件 ; 如果想读取模板再另外生成的话,试试 NPOI
优点:不依赖Microsoft组件,在内存中操作excel,读写速度快. 缺点:无法读取模板,只能生成新的excel (我亲自测试是在读取完模板后,不能保存,也不能另存,并且其他人说这个读取还会有 ...
- Lemon OA第4篇:常用功能
OA,Office Automation的简写,中文意思办公自动化,不同的人有不同的见解,可以简单的理解为网络化办公,高效.协同是其显著的特点,如今正在朝着智能的方向发展 平时不擅长文字,写出来几句话 ...
- PHP进阶。
老手段,百度“PHP进阶” 不过,今天运气不错,搜到一个“PHP特级内容讲解”,地址是:http://wenku.baidu.com/course/view/fd8e591b6bd97f192279e ...
- shell特殊符号cut命令 sort_wc_uniq命令 tee_tr_split命令 shell特殊符号
shell特殊符号cut命令 特殊符号 * 通配符,任意个任意字符 ? 任意一个字符 # 注释字符 \ 脱义字符 c=\$a\$b echo $c | 管道符 cat 1.txt |less ...
- Android使用http协议与服务器通信
网上介绍Android上http通信的文章很多,不过大部分只给出了实现代码的片段,一些注意事项和如何设计一个合理的类用来处理所有的http请求以及返回结果,一般都不会提及.因此,自己对此做了些总结,给 ...
- 黏性Session和非黏性Session
黏性Session和非黏性Session黏性Session:此模式下同一会话中的请求都被派送到同一个tomcat实例上,这样我们就无须在多台服务器之间实现session共享了,这是其好处,不好的地方就 ...
- JAXB基本使用
JAXB主要用来实现对象和XML之间的序列化和反序列化,关于JAXB的介绍就不多说了,网上一搜一大把,这里主要总结下基本使用方法和一些注意事项 首先定义两个示例类ClassA,ClassB,用于后续的 ...
- jenkins 升级jdk到1.8.0 报java.io.IOException:Unable to read /var/lib/jenkins/config.xml
今天手动下载安装了jdk1.8.0, 并修改了配置文件,当前默认使用该版本的jdk.但是报出一下错误: 问题查到: https://issues.jenkins-ci.org/browse/JENKI ...
- C语言界面显示水波纹效果
工具:VS+EasyX +素材图 EasyX首页 - EasyX Library for C++ https://www.easyx.cn/ 下载安装即可.