CSS透明属性之改变图片透明度

百度谷歌搜狗

加关注：新浪微博腾讯微博

发布时间：2013-09-22 10:44 　来源/作者：藕码网　分类：扩展区

TAG标签：

摘要：CSS透明属性之改变图片透明度

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>CSS透明属性之改变图片透明度</title>
<style type="text/css">
p{text-align:center;}
.highlightit img { /* make the div translucent */
   opacity: 0.6;                /* Firefox, Safari(WebKit), Opera,chrome/
   filter: "alpha(opacity=60)"; /* IE 8 */
   filter: alpha(opacity=60);   /* IE 4-7 */
   zoom: 1;                     /* needed in IE up to version 7, or set width or height to trigger "hasLayout" */ 
}

.highlightit:hover img { /* make the div translucent */
   opacity: 1.0;                /* Firefox, Safari(WebKit), Opera,chrome/
   filter: "alpha(opacity=100)"; /* IE 8 */
   filter: alpha(opacity=100);   /* IE 4-7 */
   zoom: 1;                     /* needed in IE up to version 7, or set width or height to trigger "hasLayout" */ 
}
</style>
</head>
<body>
<p>
<a href="http://www.oucode.com" class="highlightit"><img border="0" src="/skin/default/images/logo.png"></a>
<a href="http://www.oucode.com" class="highlightit"><img border="0" src="/skin/default/images/logo.png"></a>
</p>
<p><a href="http://www.oucode.com" target="_blank">来源：藕码网</a></p>
</body>
</html>

素材详情
用户评论
相关文章

CSS透明属性之改变图片透明度
最新评论

验证码:

菜单/ Menu

热门下载/ HOT