心有猛虎_细嗅蔷薇
首先说明一下animation的语法:animation: name duration timing-function delay iteration-count direction;展开的话:[animation-name 规定需要绑定到选择器的 keyframe 名称。]
[animation-duration 规定完成动画所花费的时间，以秒或毫秒计。]
animation-timing-function 对应的值为"linear",动画从头到尾的速度是相同的。
animation-delay 规定在动画开始之前的延迟,此处 .4s 为0.4秒
animation-iteration-count 对应的值为"infinite",动画无限次播放。
animation-direction 对应的值为"alternate",轮流反向播放动画。
<!--如果 animation-direction 值是 "alternate"，
则动画会在奇数次数（1、3、5 等等）正常播放，而在偶数次数（2、4、6 等等）向后播放。-->[...] 中代表这句代码有省略或不全;circle和animation搭配出现在Canvas中,出现在CSS语句中有点奇怪-webkit- 用来兼容webkit内核的浏览器,比如/* Safari and Chrome */,另外还有前缀 -moz- ,-o-