代码示例:(标识:css_image_transparency_1)
<!DOCTYPE html>
<html>
<head>
<style>
img {
  opacity: 0.5;
}

img:hover {
  opacity: 1.0;
}
</style>
</head>
<body>

<h1>图像透明度</h1>

<p>opacity 属性常与 :hover 选择器一起使用,改变鼠标悬停时的不透明度:</p>

<img src="/static/demo/images/tulip.jpg" alt="Tulip" width="170" height="170">
<img src="/static/demo/images/tulip-2.jpg" alt="Tulip" width="170" height="170">
<img src="/static/demo/images/flower-4.jpg" alt="Flower" width="170" height="170">

</body>
</html>
运行结果: