html – 使用CSS平滑地缩放图像_html-js-css

概述我有一张图片,如果用户将鼠标移到它上面我想要缩放.目前,这并不顺利. 例： <!DOCTYPE html><html><head><meta charset="utf-8"><title>Zoom</title><style>.zoom:hover { zoom: 1.5; }</style></head> <body><p><img src="images/image.png 我有一张图片,如果用户将鼠标移到它上面我想要缩放.目前,这并不顺利.

例：

<!DOCTYPE HTML><HTML><head><Meta charset="utf-8"><Title>Zoom</Title><style>.zoom:hover { zoom: 1.5; }</style></head> <body><p><img src="images/image.png" ></p></body></HTML>

解决方法使用变换平滑缩放：

.zoom { Transition: transform 1s;}

但是你应该改为缩放而不是缩放(感谢@val)：

.zoom:hover {     transform: scale(2); }

我created a fiddle,只为你.

总结

以上是内存溢出为你收集整理的html – 使用CSS平滑地缩放图像全部内容，希望文章能够帮你解决html – 使用CSS平滑地缩放图像所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1144355.html

html – 使用CSS平滑地缩放图像

发表评论

评论列表（0条）