html代码：
<div id="body_img"> <img src="img/11.jpg" alt=""> </div>
css代码：
<style type="text/css"> *{ margin: 0; padding: 0; } #body_img img{ width: 600px; height: 320px; cursor: pointer; /* 手动鼠标 */ transition: 1s; /* 过度时间 */ } #body_img{ width: 600px; height: 320px; overflow: hidden; /* 当图片变大超出了外包div后隐藏 */ } #body_img:hover img{ transition: 1s; /* 过度时间 */ transform: scale(1.1); /* 变形一比一放大 */ } </style>
思路：先设置一个div包含一张图片设置大小，溢出隐藏（当滑动图片上面后变大隐藏）给图片设置手动鼠标和过度时间。当鼠标滑动div上面让图片变形成一比一放大，外加过度时间
