@keyframes animationname {keyframes-selector {css-styles;}}
<u></u>keyframes用来定义CSS动画
将一套CSS样式逐渐变为另一套
可以百分比规定改变发生的时间，
或者通过关键字“from”和“to”，等价于0%和100%
animation: name duration timing-function delay iteration-count direction;
animation是一个简写属性，用于设置6个动画属性。
name：keyframes名字，
duration：动画持续时间，
timing-function：速度曲线，
delay：动画开始前的延迟，
iteration-count：播放的次数，
direction：是否轮流反向播放。
注：
animation-iteration-count:infinite;可以用于设置循环动画。
