CSS图片阴影+鼠标移上图片放大、变形

在做图片卡片列表的时候我们经常用到图片的呼吸灯效果，实现图片的阴影效果、放大、动态展示

代码：

li img {
display: block;
width: 140px;
height: 140px;
padding: 8px;
background-color: #FFF;
box-shadow: 0px 0px 18px rgba(0,0,0);（图片初始状态无阴影，也可以在颜色后面加个值实现）
-webkit-transition: all ease .3s;
transition: all ease .3s;（变化速度）
margin-bottom:10px;
border-radius: 0px（图片形状初始宽高，既img的宽高）
}
li img:hover {
-webkit-transform: scale(1.05);
transform: scale(1.05);（类似放大倍数）
box-shadow: 0px 0px 18px rgba(0,0,0,0.5);（鼠标移上后的阴影透明度，这里是0.5）
border-radius: 50%（鼠标移上后变形百分比，这里50%是圆形）
}