clip:rect下png通道透明下sprite图片定位实例页面

代码:

CSS代码:
.clip_a{display:block; width:128px; height:128px;}
.clip_a img{border:0; position:absolute; clip:rect(0 128px 128px 0);}
.clip_a:hover{border:0;}
.clip_a:hover img{margin-top:-128px; clip:rect(128px 128px 256px 0);}
                
HTML代码:
<a href="javascript:" class="clip_a">
    <img src="//image.zhangxinxu.com/image/blog/201104/sofa_sprite.png" />
</a>
                

效果: