opacity 属性为元素的背景添加透明盒效果
实例代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
div {
background-color:green;
padding:20px;
width:400px;
}
div.div1{
opacity:0.1;
}
div.div2{
opacity:0.3;
}
div.div3{
opacity:0.6;
}
</style>
</head>
<body>
<h1>透明盒</h1>
<p>当使用opacity属性为元素背景添加透明度时，其所有子元素也将变为透明。<br />这可能会使完全透明的元素内的
文本难以阅读。</p>
<div class="div1" >opacity 0.1</div>
<div class="div2">opacity 0.3</div>
<div class="div3">opacity 0.6</div>
<div>opacity 1（default）</div>
</body>
</html>
~ 运行效果：
评论