效果:
实现:
HTML:
<div class="box"></div>
CSS:
.box {
position:absolute;
top:50%;
left:50%;
transform:translate(-50%, -50%);
width:200px;
height:50px;
background: skyblue;
box-shadow:-5px 5px 0px rgba(0,0,0,0.2);
cursor:pointer;
transition: all 0.5s;
}
.box:hover {
transform:translate(calc(-50% + 3px), calc(-50% - 3px));
box-shadow:-10px 10px 0px rgba(0,0,0,0.2);
}