鼠标移入放大移出缩小

利用transfrom属性,对图片放大缩小

//dom元素结构
<div class="outbox">
            <img src="./img/3.jpg" alt="">
</div>

//css样式
          .outbox {
                width: 300px;
                height: 160px;
                overflow: hidden;
            }
            img {
                height: 100%;
                transition: .2s transform ease-in-out;
            }
            img:hover {transform: scale(1.1)}

 

posted @ 2021-08-09 13:58  橘雎  阅读(173)  评论(0编辑  收藏  举报