这篇文章主要介绍CSS怎么设置图片放大效果，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！

思路：图片放大的动画效果还是由transition和transform实现。先设置 div 的初始位置，过渡的时间等，之后设置 translate，scale，rotate 等属性。

translate：代表水平和垂直的移动；

scale：代表水平和垂直同时缩放；

rotate：表示旋转的角度。

具体代码：

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>CSS图片放大-亿速云(yisu.com)</title><style>div{width:200px;height:100px;transition:all.3s;}div:hover{transform:translate(100px,100px)scale(2)rotate(0deg);}</style></head><body><div><imgsrc="https://7n.yisu.com/statics/img/logo/indexlogo@2x.png"alt="w3cschool"></div></body></html>

以上是“CSS怎么设置图片放大效果”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注亿速云行业资讯频道！