相关疑难解决方法(0)

如何使用 CSS 在鼠标悬停时缩放图像?

我只是想缩放图像。我需要自动给出产品列表的高度,因为它没有响应,但是当我这样做时,容器会向下延伸,我该如何避免这种情况?

.zoom-img {
  width: 300px;
  height:auto;
  overflow: hidden;
}

.zoom-img  img {
  width: 100%;
  transition: all .3s ease-in-out;
}

.zoom-img img:hover   {
  transform: scale(1.2);
}
Run Code Online (Sandbox Code Playgroud)
<div class="zoom-img">
  <img src="https://www.arthenos.com/wp-content/uploads/2017/08/Manzara_fotografciligi_2-1200x900.jpg" alt="This zooms-in really well and smooth">
</div>
Run Code Online (Sandbox Code Playgroud)

我的悬停图像 在此输入图像描述

css

8
推荐指数
1
解决办法
2万
查看次数

标签 统计

css ×1