CSS3实现鼠标移入图片,图片放大缩小
CSS3实现鼠标移入图片,图片放大缩小
CSS:
tc>div>ul>li>img{ display: inline-block; vertical-align: top; width: 295px; height: auto; margin: 0 20px 18px 0; background: white; box-sizing: border-box; transition: all .5s; -webkit-transition: all .5s; /* Safari */ } .tc>div>ul>li>img:hover { cursor: pointer; transform: scale(1.1); -ms-transform:scale(1.1); /* IE 9 */ -moz-transform:scale(1.1); /* Firefox */ -webkit-transform:scale(1.1); /* Safari 和 Chrome */ -o-transform:scale(1.1); }
html:
<div class="tc mld"> <h5><span>新起点博客</span><small></small></h5> <div> <ul> <li onclick="window.open('video.html')"> <img src="image/1.jpg"> </li> </ul> </div>