鼠标 hover时盒子阴影效果，凸起效果_ box-shadow的应用

盒子阴影

 <div class="test-shadow"></div>
<style>
   .test-shadow{
        background-color: rgb(180, 224, 241);
        width: 200px;
        height: 300px;
        margin-top:30px;
    }
    .test-shadow:hover{
        margin-top: 0px;/*和hover的margin-top有对比，原无30,现在0，相当于上移了,30px*/
        box-shadow: 0 0 20px 2px #918f8f;/*盒子阴影*/
        transition: all 0.5s;/*持续时间*/
    }
</style>