CSS3图片以中心缩放,放大超出隐藏实现

<!--Html代码-->
<div class="selfScale"> <img sr="#" /> </div>


/*样式代码*/

.selfScale{//容器
cursor: pointer;
width: 100%;
overflow: hidden;
position: relative;
}
.selfScale img{//容器中东西
width: 100%;
top: 0;
position: relative;
left: 0;
-webkit-transition: -webkit-transform 0.3s;
-moz-transition: -moz-transform 0.3s;
-o-transition: -o-transform 0.3s;
transition: transform 0.3s;
}
.selfScale img:hover{
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);
}

猜你喜欢

转载自www.cnblogs.com/Deml/p/9752855.html