CSS案例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>饭桶教程(kuaikuaixuan.com)</title>
<style>
img
{
opacity:0.4;
filter:alpha(opacity=40); /* 适用 IE8 及其更早版本 */
}
img:hover
{
opacity:1.0;
filter:alpha(opacity=100); /* 适用 IE8 及其更早版本 */
}
</style>
</head>
<body>
<h1>图片透明度</h1>
<p>opacity 属性通常与 :hover 选择器一起使用,在鼠标移动到图片上后改变图片的透明度:</p>
<img src="/images/klematis_small.jpg" width="150" height="113" alt="klematis">
<img src="/images/klematis2_small.jpg" width="150" height="113" alt="klematis">
<p><b>注意:</b>在 IE 中必须声明 &lt;!DOCTYPE&gt; 才能保证 :hover 选择器能够有效。</p>
</body>
</html>