当前位置：网站首页>opacity和rgba的区别

opacity和rgba的区别

2022-08-09 15:03:00 【不知-_】

opacity和rgba都是css中设置透明度的方式。

文章目录

opacity属性

opacity 属性设置元素的不透明级别。

语法：

opacity: value|inherit;
值描述
valuevalue 规定不透明度。从 0.0 （完全透明）到 1.0（完全不透明）
inherit应该从父元素继承 opacity 属性的值。

在这里插入图片描述


rbga属性值

rgba() 函数使用红( R)、绿(G)、蓝(B)、透明度(A)的叠加来生成各式各样的颜色。
语法：

rgba(red, green, blue, alpha)
值描述
red定义红色值，取值范围为 0 ~ 255，也可以使用百分比 0% ~ 100%。
green定义绿色值，取值范围为 0 ~ 255，也可以使用百分比 0% ~ 100%。
blue定义蓝色值，取值范围为 0 ~ 255，也可以使用百分比 0% ~ 100%。
alpha - 透明度定义透明度 0（完全透明） ~ 1（完全不透明）

opacity和rgba的区别

  1. opacity
    opacity是一个属性。opacity属性的值，可以被其子元素继承，给父级div设置opacity属性，那么所有子元素都会继承这个属性，并且，该元素及其继承该属性的所有子元素的所有内容透明度都会改变。
  2. rgba
    rgba是一个属性值。rgba设置的元素，只对该元素的背景色有改变，并且，该元素的后代不会继承该属性。

在这里插入图片描述

原网站

版权声明
本文为[不知-_]所创，转载请带上原文链接，感谢
https://blog.csdn.net/http____/article/details/125112831

边栏推荐

猜你喜欢

随机推荐