opacity和rgba()
以下是我最近在仿站时的一点小收获,不喜勿喷。
rgba:
语法:rgba(R,G,B,A) ;
R:红色值。正整数 | 百分数(0—255)
G:绿色值。正整数 | 百分数(0—255)
B:蓝色值。正整数 | 百分数(0—255)
A:Alpha透明度,取值为0—1。
正整数为十进制的0—255之间的任意值,百分数为0%—100%的任意值。
Opacity:
语法:opacity : value | inherit ;
value:不透明度,从0(完全透明)—1(完全不透明)。
区别:
opacity和rgba()都可以设置透明度,但opacity在设置透明度时会被其子元素继承,举个例子:
分别用opacity和rgba设置背景的透明度,显示出的效果如下:
上面一个是opacity设置的显示出来的结果,由于opacity会被子元素<p>继承,所以字也变透明了,而下方那个是rgba设置的,只有背景颜色变透明了。所以在设置背景透明度时如果不希望其子元素也透明,建议用rgba()设置。