css实现鼠标移上图片遮罩效果
ie6对hover支持不完善，所以不兼容，最好在火狐或谷歌等标准浏览器中观看。Demo下载
效果如图：
css：
#demo {
width: 306px;
height: 204px;
padding: 3px;
border: 1px solid #e5e5e5;
margin: 100px auto 0 auto;
background: #fff;
}
#demo:after {
content: "";
display: block;
height: 0;
clear: both;
}
#demo:hover li span {
display: block;
}
#demo li {
float: left;
width: 100px;
height: 100px;
position: relative;
margin: 1px;
}
#demo li span {
display: none;
width: 100px;
height: 100px;
background: #000;
opacity: 0.35;
position: absolute;
top: 0;
left: 0;
overflow-y: none;
}
#demo li:hover span { display: none; }
html：
<ul id="demo">
<li><span></span><img src="images/1.jpg" ></li>
<li><span></span><img src="images/2.jpg" ></li>
<li><span></span><img src="images/3.jpg" ></li>
<li><span></span><img src="images/4.jpg" ></li>
<li><span></span><img src="images/5.jpg" ></li>
<li><span></span><img src="images/6.jpg" ></li>
</ul>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
