项目需要最近开始最html开发了，项目中需要用到鼠标悬停时候图片的放大效果,废话少说，上代码
<div class="listitem fl">
<img class="listitemimage">
<span>大个云南蒙自石榴（礼盒装</span>
<span>￥128.00/12个</span>
</div>
css中的代码
.listitem{
width: 100px;
height: 160px;
margin-left: 20px;
margin-top: 20px;
overflow: hidden;
}
.listitemimage{
width:100px ;
height: 100px;
background: url("../image/itemimage.png");
transition:all 0.6s;
}
.listitemimage:hover{
transform: scale(1.4);
}
注意
1.一定要dlistitem中用的是margin-left，不是padding-left，否则不以中心缩放。
2.一定要在父节点上面添加overflow: hidden;
