我有一张图片，如果用户将鼠标移到它上面，我想对其进行缩放。目前，这并不顺利。
示例:
<!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" class="zoom"></p>
</body>
</html>
最佳答案
使用transform平滑缩放:
.zoom {
transition: transform 1s;
}
但是你应该改为 scale 而不是 zoom(感谢@val):
.zoom:hover {
transform: scale(2);
}
我created a fiddle ，只为你。
关于html - 使用 CSS 平滑地缩放图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29815813/