html 图片放大div自动加边框,CSS实现鼠标聚焦时边框不变，框内图片放大

div{

cursor: pointer;

width: 130px;

height: 130px;

position: relative;

overflow: hidden;

}

img{

border: 0 none;

vertical-align: middle;

}

.mask{

height: 100%;

width: 100%;

z-index: 10;

position: absolute;

}

.avatar{

height: 100%;

width: 100%;

bottom: 0;

top: 0;

left: 0;

right: 0;

position: relative;

transition: all 0.3s ease 0s;

display: inline;

}

div:hover .avatar{

-webkit-transform: scale(1.2);

-moz-transform: scale(1.2);

-o-transform: scale(1.2);

transform: scale(1.2);

}