opacity和rgba的区别

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

文章目录

opacity属性
rbga属性值
opacity和rgba的区别

opacity属性

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

语法：

opacity: value|inherit;

值	描述
value	value 规定不透明度。从 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的区别

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

opacity和rgba的区别相关推荐

opacity和rgba()的区别
在css中设置背景颜色透明的方法有两种:一种是通过rgba方式设置,另一种是通过backgroud和opacity设置. 1.下图是opacity的效果文字也跟着背景透明 2.下图是rgba() ...
颜色之ARGB与RGB、RGBA的区别与介绍
ARGB 是一种色彩模式,也就是RGB色彩模式附加上Alpha(透明度)通道,常见于32位位图的存储结构. RGB 色彩模式是工业界的一种颜色标准,是通过对红(R).绿(G).蓝(B)三个颜色通道的变 ...
亲爱的老狼-opacity、rgba、transparent的应用
1>opacity是透明色的一种,他是一种具有继承性的标签,它不仅会让背景色变的透明,还会造成所在盒子里的内容也透明.所以要慎用,不然,当想让子元素不再透明时,opacity.rgba.等均不具 ...
opacity、transparent以及rgba的区别
简单总结下opacity.transparent以及rgba 这几个概念最开始学的时候只是有个大致印象,现在复习这部分的知识点,发现不仔细区分一下,还真有点混乱. 三者共同点是都和透明有关.先分着来说 ...
ARGB与RGB、RGBA的区别
ARGB 是一种色彩模式,也就是RGB色彩模式附加上Alpha(透明度)通道,常见于32位位图的存储结构. RGB 色彩模式是工业界的一种颜色标准,是通过对红(R).绿(G).蓝(B)三个颜色通道的变 ...
display、opacity、visibility的区别？
共同点都让元素不可见二者区别隐藏后是否占据原有空间 display:none ,不占据空间,页面重新渲染 visibility:hidden 占据空间,不能触发点击事件 opacity:0 ,占 ...
css hsla和rgba的区别
在CSS3里可以使用RGBA和HSLA两种色彩模式,都可以用来在设置颜色的同时也可以设置它的透明度.RGBA指的是"红色.绿色.蓝色和Alpha透明度"(Red-Green-Blu ...
rgb和rgba的区别关系
rgb和rgba都表示颜色. rgb: 由红绿蓝三种颜色组成,由着三种颜色组合表示不同颜色,取值分别为0-255. rgba: 在rbg的基础上加了alpha透明度,取值在0-1之间.
前端知识点回顾——HTML，CSS篇
前端知识点回顾篇--是我当初刚转行为了面试而将自己学过的前端知识整理成的一份笔记,个人目的性很强,仅供参考. doctype 有什么用 doctype是一种标准通用标记语言的文档类型声明,目的是告诉标 ...

opacity和rgba的区别

文章目录

opacity属性

rbga属性值

opacity和rgba的区别

opacity和rgba的区别相关推荐

最新文章

热门文章