首页 > 其他 > 详细

opacity与rgba

时间:2016-03-11 01:01:07      阅读:267      评论:0      收藏:0      [点我收藏+]

 opacity与rgba的区别

实现半透明有两种方式:
(1)background-color:rgb(0,0,0);opacity:.2;
(2)background:rgba(0,0,0,.2);

这两种方式是不同的。
opacity方式,会将元素的子元素也变成半透明的,例如:文字
rgba方式,只对该元素进行设置,不影响子元素。

首先使用了opacity属性

技术分享

仔细看,是可以通过黑色框内白色的字,看到网页文本里的字的。

 在使用了background-color:rgba(0,0,0,0.5)之后

技术分享

这里仅仅是背景透明了,框内的文字并没有继承该属性,所以并不能透过文字看到网页里的文本

 

opacity与rgba

原文:http://www.cnblogs.com/acorn/p/5264113.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!