CSS3鼠标悬停图片动画合集
10 种纯 CSS3 的 transform 动画，是那种一看就想马上用在项目里的小技巧合集。都是鼠标悬停触发的，像放大、旋转、平移这些基础操作，不用写一行 JavaScript，全靠 CSS 搞定，简单又高效。
纯 CSS 的图片动画，用得好真的挺加分的。尤其是在电商页、作品展示页这些地方，能一下子提升页面质感。transform配合:hover用，就能搞出多花样。
比如常见的scale放大效果，鼠标一过去图片微微变大，视觉上就有吸引力；再比如rotate旋转，轻轻一转，动感就来了。要组合用也 easy，transform: scale(1.2) rotate(10deg)这样一写就行。
动画要流畅的话，记得加上transition，比如transition: all 0.3s ease，响应也快，体验也好。
兼容性方面也别忽略，虽然现代浏览器都支持，但加个-webkit-之类的前缀比较稳。
哦对了，不要贪多。动画多了页面卡，得不偿失。你可以先挑两三个效果，加在重点区域。
如果你正好在做交互动效，又不想引入 JS，这套 CSS3 动画效果，蛮值得一试。
顺手推荐几个类似的资源，也挺实用的：
下载地址
用户评论
