社会喵

animation: name duration timing-function delay iteration-count direction fill-mode play-state
animation：动画名称 动画时间 运动方法 何时开始 播放次数 是否反方向 不播放时样式 运行状态;
下面是每个参数详细的解释及参数

animation-name 动画名称
为动画设定一个名称，需对应@keyframes的名称
例：

div{
	animation-name:myAnimation;
}
@keyframes myAnimation{
	from {}
	to {}
}

animation-duration 动画时间
为动画设定运动总时长
例：
animation-duration:5s;设置时长为5秒（如果时长为0.5秒，则可以省略为.5s）

animation-timing-function 运动方法
设置动画如何完成一个周期
例：
animation-timing-function: linear;
可用参数如下

animation-delay 何时开始
设置动画的延时时长
例：
animation-delay: 5s; 设置延时为5秒（5秒后才会触发）

animation-iteration-count 播放次数
设置动画触发时播放的次数
例：
animation-iteration-count: 5; 设置播放次数为5次（如果设置为infinite就是永远播放）

animation-direction 是否反方向
设置动画是否循环交替反向播放
例：
animation-direction: reverse;
可用参数如下

animation-fill-mode 不播放时样式
设置当动画不播放时，使用的样式
例：
animation-fill-mode: none; 设置不播放时无样式
可用参数如下

animation-play-state 运行状态
设置动画当前的播放是否为正在运行或已暂停
例：
animation-play-state: paused; 设置暂停动画
可用参数如下

animation的使用示例：

animation: go 3s linear 0s 1 normal;
@keyframes go {
　　0% {top:0px;}
　　50%{top:50px;}
　　100%{top:100px;}
}