呼吸灯效果（图片划过放大，划出变小）
<!DOCTYPE HTML><html lang="zh-CN">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>test</title>
<style type="text/css">
ol, ul {list-style: none;}
li {width: 180px;height: 120px;display: inline-block;list-style: none；overflow:hidden;}
li img {
display: block;
width: 140px;
height: 80px;
background-color: #FFF;
box-shadow: 0px 0px 18px rgba(0,0,0,.4);
-webkit-transition: all ease 1s;
-moz-transition: all ease 1s;
-o-transition-delay: all ease 1s;
transition: all ease 1s
}
li img:hover {
-webkit-transform: scale(1.2,1.2);
-moz-transform: scale(1.2,1.2);
-transform: scale(1.2,1.2);
-webkit-transition: all ease 1s;
-moz-transition: all ease 1s;
-o-transition-delay: all ease 1s;
transition: all ease 1s
}
</style>
</head>
<body>
<ul>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
<li><a href="#"><img src="#" width="140" height="80" alt=""></a></li>
</ul>
</body>
</html>
