CSS 图像透明/不透明

CSS 图像透明/不透明


使用CSS很容易创建透明的图像。

注意:CSS Opacity属性是W3C的CSS3建议的一部分。


创建透明图像 - 悬停效果

<!DOCTYPE html>
<html>
<head>
<title>test</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="sl.png" width="150" height="113" alt="sl">
<img src="sl.png" width="150" height="113" alt="sl">

<p><b>注意:</b>在 IE 中必须声明 &lt;!DOCTYPE&gt; 才能保证 :hover 选择器能够有效。</p>
</body>
</html>

  

猜你喜欢

转载自injavawetrust.iteye.com/blog/2335241
今日推荐