我们既可以制作半透明的边框，又可以制作半透明的背景。
代码：
.rgba{
background: rgba(255,0,0,0.5);
}
.opacity{
background: red;
opacity: 0.5;
}
当用这两种样式制作半透明背景时，产生效果：
金金金金.png
子元素 opacity 会继承父元素的 opacity 属性，而RGBA设置的元素的后代元素不会继承不透明属性。
opacity属性的值，可以被其子元素继承。例如，我们将上面图中div里面的文字用p标签括起来，尽管，我们只给div设了不透明度，但是我们的p标签中的文字也是有透明度的。
金金金金.png
所以RGBA相对于Opacity还是技高一筹的。当然，只要是涉及到颜色的都可以用RGBA来设置，比如上面用到的background-color、text-shadow、box-shadow。
背景： 我们既可以制作半透明的边框，又可以制作半透明的背景。 代码： 当用这两种样式制作半透明背景时，产生效果： ...
关于透明度属性区别 rgba()和opacity的透明效果有什么不同？ rgba()和opacity都能实现透明效...
30.rgba和opacity的区别？ （1）rgba和opacity都能实现透明效果，但最大的不同在于opaci...
颜色定义： opacity 透明度的属性 rgba（）和opacity都能实现透明效果但是opacity是...
在CSS样式中，设置透明度的方式有两种。其一，opacity；其二rgba()。opacity和rgba()在一定...
background的属性没有继承性 字体颜色有继承性 opacity 有继承性
rgba opacity 他们的区别是什么呢? 有opacity属性的所有后代元素都会继承 opacity 属性，...
opacity作用于元素，以及元素内的所有内容的透明度， 而rgba()只作用于元素的颜色或其背景色。（设置rgb...
说到透明度，联想到的一定是rgba和opacity啦，但是两者之间有什么区别？我们来弄清楚一下 两者之间的区别 R...
opacity:xbackground-color: rgba(0, 0, 0, 0.4);color:trans...
本文标题：浅谈opacity和rgba
本文链接：https://www.haomeiwen.com/subject/bfyzyxtx.html
网友评论