opacity 属性指定元素的不透明度/透明度。取值范围为 0.0 - 1.0。值越低,越透明
实例代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
div{
background-color:green;
width:500px;
}
.first{
opacity:0.1;
}
.second{
opacity:0.3;
}
.third{
opacity:0.6;
}
</style>
</head>
<body>
<h1>透明框</h1>
<p>当使用opacity属性为元素背景添加透明度时,其所有子元素也会变为透明。<br>这可能会使完全透明的元>素内的文本难以阅读。</p>
<div class="first">
<h1>opacity 0.1</h1>
</div>
<div class="second">
<h1>opacity 0.3</h1>
</div>
<div class="third">
<h1>opacity 0.6</h1>
</div>
<div >
<h1>opacity 1</h1>
</div>
</body>
</html>
运动效果:
评论