html - 鼠标离开图像时的缩放过渡

Question

我还没有找到答案，我的网站上有一张图片，使用 hover 当我的鼠标悬停在图片上时，我有一个小的缩放过渡，但如果鼠标不在，则有没有过渡是否可以添加到初始位置的平滑过渡？如果是，怎么办？

谢谢

Answer 1

您需要将过渡添加到元素，而不是 :hover。

img {
  height: 200px;
  transition: all 0.4s;
}
img:hover {
  transform: scale(1.2);
}

<img src="http://butlers-web.com/Content/Images/BW%20Logo%203.0.png" />