ITPub博客

首页 > IT职业 > IT职场 > CSS3中RGBA和opacity的区别

CSS3中RGBA和opacity的区别

IT职场 作者:kboypkb 时间:2021-09-09 09:51:22 0 删除 编辑

RGBA是什么?

是在RGB的基础上增加了一个通道Alpha。Alpha参数为透明值,在0~1之间。

RGBA 不仅可以用在 background 属性上,还可以用在 color 和 border 属性中。

RGBA和opacity之间的不同点是前者只应用到指定的元素上,后者会影响指定的元素及其子元素。

下面通过实例演示来说明 。

效果展示:


图片描述

rgba演示.png

<!--HTML部分-->
RGBA测试
opacity测试
          /*css部分*/ 
            #demo {                width: 200px;                height: 100px;                background: rgba(25, 25, 25, .5);                margin: 10px;
            }            
            #demo2 {                width: 200px;                height: 100px;                background: rgb(25, 25, 25);                opacity: .5;                margin: 10px;
            }



作者:ywyan
链接:https://www.jianshu.com/p/32b534e26c12


来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/1916/viewspace-2813482/ ,如需转载,请注明出处,否则将追究法律责任。

上一篇: js 单项链表
请登录后发表评论 登录
全部评论

注册时间:2019-07-24

  • 博文量
    103
  • 访问量
    8754