参考案例：
鼠标经过图片，图片放大。
1.html:
<body>
<div>
<a href="#"><img src="http://qq1234.org/uploads/allimg/140604/3_140604154539_2.jpg"></a>
</div>
</body>
2.css:
div{ width: 200px; height: 200px; margin: 0 auto; border: 2px #64ecd2 solid;}
a{ display: inline-block;}
div img{ width: 200px; height: 200px;}
实现css3图片放大效果，需要用到transform和transition。
transform：旋转元素。transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。
Internet Explorer 10、Firefox、Opera 支持 transform 属性。
Internet Explorer 9 支持替代的 -ms-transform 属性（仅适用于 2D 转换）。
Safari 和 Chrome 支持替代的 -webkit-transform 属性（3D 和 2D 转换）。
Opera 只支持 2D 转换。
transition:过渡效果。transition: property（过渡效果的css3属性的名称） duration（完成过渡时间） timing-function（速度曲线） delay（何时开始）;
3.单纯的添加css3
div a:hover img{
transition:transform .5s ease-out;
-o-transition:transform .5s ease-out;
-webkit-transition:transform .5s ease-out;
-moz-transition:transform .5s ease-out;
transform: scale(1.2);
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
}
原图：
效果图：
发现，图片效果是有了，但是超出了我原有div的宽高。
所以，我在div中增加了 overflow:hidden; 属性。
效果图：
这样效果就达到了我需要的要求，具体大小细节可以修改