1. 前言
前面将的概念，算是比较抽象比较难一些了，本篇介绍的透明就非常好理解。CSS可以通过opacity属性设置元素的透明程度，取值范围0-1，当取值为1时是完全不透明，而取值为0是完全透明。
2. 实例解析看如下代码：
<head>
<meta charset="utf-8">
<style>
.opacity-none {
opacity: 1;
}
.opacity-low {
opacity: 0.7;
}
.opacity-high {
opacity: 0.3;
}
.opacity-full {
opacity: 0;
}
</style>
</head>
<body>
不透明效果:
<img src="img.jpg" class="opacity-none">
低透明效果:
<img src="img.jpg" class="opacity-low">
高透明效果:
<img src="img.jpg" class="opacity-high">
完全透明效果:
<img src="img.jpg" class="opacity-full">
opacity取值越小，透明度越高，所以效果如下：
3. 小结
通过opacity属性可以轻松的设置元素的透明度。