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 因为在项目中需要用到一 ...
随机推荐
- Can't read [proguard.ClassPathEntry@1a0c10f] (No such file or directory)
//该错误无法识别,是因为你使用了旧版本的proguard,建议你下载新版本4.5以上的proguard来替代Android SDK中使用的旧版sdcard 这样你就可以知道错误所在.因为只有4.5版 ...
- 运行 Shell 脚本有两种方法:
1.作为可执行程序 将上面的代码保存为 test.sh,并 cd 到相应目录: chmod +x ./test.sh #使脚本具有执行权限 ./test.sh #执行脚本 注意,一定要写成 ./tes ...
- iOS: 查看 UIView 的视图树
在想要查看的 UIView 附近打个断点,运行,直到停在断点处,在控制台键入:po [view recursiveDescription],回车. (lldb) po [self recursiveD ...
- middle
/** * Created by lkl on 2017/7/31. *//** * Created by lkl on 2017/6/26. *///spark-shell --driver-cla ...
- [转]Phantomjs实现获取网页快照并生成缩略图
Shell脚本实现获取网页快照并生成缩略图 这篇文章主要介绍了Shell脚本实现获取网页快照并生成缩略图,本文获取网页快照使用phantomjs.生成缩略图使用ImageMagick,需要的朋友可以参 ...
- MathType如何编辑大三角形符号
MathType中包含的符号超过1000多个,可以满足我们很多学科的使用,尤其是数学中,涉及到很多的符号,常见的就是代数.几何这两大类,当然还有集合之类的符号使用也比较多.我们在用MathType编辑 ...
- Python打包-Pyinstaller
我们知道,Python很优雅,很值得学习.但是Python是解释性语言,代码需要有Python解释器才能执行,相比较我们平时直接运行exe等可执行文件多了一步的麻烦. 于是,希望能将Python程序打 ...
- mysql数据库中,如何对json数据类型的值进行修改?通过json_set函数对json字段值进行修改?
需求描述: 今天在看mysql中存放json数据类型的问题,对于json数据进行修改的操作, 在此记录下. 操作过程: 1.创建包含json数据类型的表,插入基础数据 mysql> create ...
- 用VS2012不能打开VS2010的项目
应该是装过sql2012或者sql2008,自带的那个visual studio,你可以直接在外面打开VS2012,然后用里面的文件去打开项目.而不要直接双击那个解决方案的文件.
- iphone弹出窗口效果的制作(Core animation, CALayer)
效果类似人人网微薄客户端的弹出效果 static CGFloat kTransitionDuration = 0.3; - (void)initView { UIWindow *window = [U ...