[分享]css3怎么实现图片缩放

CSS3中提供了一些很酷的功能，其中一个是图片缩放。我们可以利用CSS3的transform属性来实现缩放效果。

.img-scale{
   width: 200px;
   height: 200px;
   -webkit-transition: all 0.3s ease-in-out;
   transition: all 0.3s ease-in-out;
}

.img-scale:hover{
   transform: scale(1.2);
} 

以上代码中，我们首先设定图片的宽度和高度。接着，我们为图片添加了一个hover事件，当鼠标悬浮在图片上时，使用transform属性将图片的大小缩放为原来的1.2倍。其中，我们使用了CSS3新属性scale()，用来缩放元素的大小。这里我们设置为1.2，即缩放为原来的1.2倍。

在hover事件中，我们还添加了一个过渡效果，使得缩放效果显得更加平滑自然。通过设定缩放时长和缓动函数，我们可以控制图片缩放的速度和效果，这里我们使用了ease-in-out，即缓慢进入和缓慢退出的效果。

以上就是实现CSS3图片缩放的代码示例，希望对大家有所帮助。