rgba和opacity设置透明度的区别

前言

rgba和opacity都可以用于透明度的显示,设置rgba的父元素透明度不会作用于子元素。设置opacity的父元素同名都会作用于内部子元素。

rgba

rgba(0-255,0-255,0-255,0-1),最后一个参数的范围是0-1表示当前元素的透明度,不会影响到子元素

如下图,我给标题的背景色设置了rgba透明度,其内部的子元素‘dididi’不会有透明度

background: rgba(52,171,255,.1);

 

 opacity

当我给我给标题的背景色设置了opacity后,会影响内部的子元素‘dididi’的透明度.如下图

background:#0f3263;
  opacity: 0.5;

 

posted @ 2020-06-28 13:49  大笛子  阅读(406)  评论(0编辑  收藏  举报