注意外面的div一定要比里面的图片大
<div class="img-box">
<img class="right-img" src="{{'/uploads/'.$val->cover}}" alt="">
</div>
.img-box {
width: 30%;
height: 180px;
position: relative;
overflow: hidden;
/*background: #ececec;*/
margin-right: 5%;
}
.right-img {
/*z-index:2;*/
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
object-fit: cover;
-webkit-transition: -webkit-transform 1s ease 0s;
transition: transform 1s ease 0s;
-webkit-transform-origin: center;
transform-origin: center;
}
.right-img:hover {
cursor: pointer;
/*transition: 0.7s;*/
/*transform: scale(0.9);*/
/*-webkit-transform: scale(0.9);*/
transform: scale(0.9);
}