css3opacity属性设置元素的不透明级别。
语法:
opacity: value|inherit;
属性值:
value规定不透明度。从 0.0 (完全透明)到 1.0(完全不透明)。
inherit应该从父元素继承 opacity 属性的值。
示例:
<!DOCTYPE html> <html> <head> <style> div { background-color:red; opacity:0.5; filter:Alpha(opacity=50); /* IE8 以及更早的浏览器 */ } </style> </head> <body> <div>本元素的不透明度是 0.5。请注意,文本和背景色都受到不透明级别的影响。</div> </body> </html>
效果图:
rgba色彩模式与RGB相同,只是在RGB模式上新增了Alpha透明度
RGBA
说明:
RGBA(R,G,B,A)
取值:
R:红色值。正整数 | 百分数
G:绿色值。正整数 | 百分数
B:蓝色值。正整数 | 百分数
A:Alpha透明度,取值0~1之间。
示例:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> div{ width:450px; height: 300px; background-color: rgb(255, 0, 0,0.3); } </style> </head> <body> <p>设置透明度为30��红色</p> <div></div> </body> </html>
效果图:
以上就是css3中怎么设置不透明度?的详细内容,更多请关注易知道|edz.cc其它相关文章!