鼠标移入或经过，div以中心为原点放大，移出后div变回原样

Question

.left_mb {
width: 10%;
min-width:138px;
height: 22%;
min-height:180px;
margin: 1% 7.5px;
float: left;
position: absolute;
transition:all 1s;
}

Answer 1

通过CSS三的trasition属性来实现。例如：

.div1{
width:100px;
height:100px;
border:red 1px solid;
transition:all 3s;
}
.div1:hover{
width:200px;
height:200px;
}

追问

不不不，我的意思是以div中心为原点向四周放大，您这个是左上角为原点

Answer 2

<style>
.abc{width:100px;height:100px; margin:200px auto 0 auto;background:#f00}
.abc:hover{width:120px; height:120px; margin:-10px 0 0 -10px}
</style>
<div class="abc"></div>追问

我的意思是以div中心为原点向四周放大，您这个是左上角为原点

追答

我知道，只是给你一个实例；
你外面肯定还要给一个盒子包起来啊，完整代码：

.a1{width:100px; height:100px; margin:200px auto;}
.abc{width:100px;height:100px;background:#f00; position:relative; transition:.5s}
.abc:hover{width:120px; height:120px; margin:-10px 0 0 -10px}

本回答被提问者采纳