呼吸燈效果實現，控件的呼吸燈效果
網頁源碼：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<style type="text/css">
.breathe-btn{ position:relative; width:100px; height:10px; margin:40px auto; line-height:40px; border:1px solid #2b92d4; border-radius:5px; color:#fff; font-size:20px; text-align:center; cursor:pointer; box-shadow:0 1px 2px rgba(0,0,0,.3); overflow:hidden; background-image: -webkit-gradient(linear, left top, left bottom, from(#6cc3fe), to(#21a1d0));
-webkit-animation-timing-function: ease-in-out;
-webkit-animation-name: breathe;
-webkit-animation-duration: 2700ms;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
}
@-webkit-keyframes breathe {
0% { opacity: .2; box-shadow:0 1px 2px rgba(255,255,255,0.1);}
100% { opacity: 1; border:1px solid rgba(59,235,235,1); box-shadow:0 1px 30px rgba(59,255,255,1);}
}
</style>
</head>
<body>
<div class="breathe-btn"></div>
</body>
</html>
效果圖：
圖像是漸變的點亮與變暗。
