CSS 教程之 opacityCSS 中 opacity 属性用于指定元素的透明度，其值为 0.0~1.0 范围内的数字，0.0 表示完全透明，1.0 表示完全不透明。这个属性常常用于制作淡入淡出的效果，或者控制某个元素的可见度。下面是几个使用 opacity 属性的例子：

例子1：相册图片悬停时淡出

.album img:hover {opacity: 0.5;transition: opacity 0.3s ease-in-out;}.album img {transition: opacity 0.3s ease-in-out;}

例子2：文本阴影透明度

h1 {color: blue;text-shadow: 2px 2px 2px rgba(0,0,0,0.5);}

例子3：背景透明度

.banner {background-color: #333;opacity: 0.8;}

需要注意的是，当元素的 opacity 值小于 1.0 时，它的子元素也会被相应地受到影响。如果需要针对子元素做不同的透明度效果，可以使用 RGBA 颜色模式。例如，下面的代码会让 p 元素背景为黑色、透明度为 0.5，但它的子元素 p 的文本颜色为白色、不透明度为 1.0：

p {background-color: rgba(0, 0, 0, 0.5);}p {color: white;opacity: 1.0;}

总结：opacity 属性是 CSS 中一个简单实用的特性，可以制作出很多有趣的效果，比如淡入淡出、提示框弹出等。需要注意的是，它对子元素也有影响，可以使用 RGBA 颜色模式来细分不同的透明度。