图片在鼠标经过时变大

≯℡__Kan透↙ 提交于 2020-01-16 00:21:28

<ul id="enlarge">
<li><a href="#one"><img src="http://www.ihandu.com/googlelink.gif" alt="image 1"

title="image 1" />Image 1</a></li>

</ul>

<style>
#enlarge {padding:0; margin:2em auto; list-style-type:none; width:240px;

height:40px;}
#enlarge li {display:block; float:left; width:40px; height:40px;

position:relative;}
#enlarge li a {display:block; width:40px; height:40px; background:transparent;

overflow:hidden; position:relative;}
#enlarge li a img {width:100%; height:100%; border:0;}
#enlarge li a:hover {position:absolute; left:-20px; top:-20px; width:80px;

height:80px; z-index:100;}

</style>



标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!