admin 管理员组

文章数量: 1086019

鼠标移入图片放大

定义好样式class

使用一个块元素(例如div),添加class scale-img到其中,包裹着img

.scale-img{overflow: hidden;}
.scale-img img{width: 100%;height: 100%;-webkit-object-fit: cover;object-fit: cover;    transition: .5s all linear;-ms-transition: .5s all linear; /* IE 9 */-moz-transition: .5s all linear; /* Firefox */-webkit-transition: .5s all linear; /* Safari 和 Chrome */-o-transition: .5s all linear; /* Opera */
}
.scale-img:hover img{transform: scale3d(1.1,1.1,1.1);-ms-transform: scale3d(1.1,1.1,1.1);-moz-transform: scale3d(1.1,1.1,1.1);-webkit-transform: scale3d(1.1,1.1,1.1);-o-transform: scale3d(1.1,1.1,1.1);
}

当你想实现图片img鼠标移入放大,直接在img的父亲dom的class加上scale-img即可

本文标签： 鼠标移入图片放大

版权声明：本文标题：鼠标移入图片放大 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/b/1686558614a10146.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。