CSS查漏补缺之动画

CSS3动画属性一览：

animation-name："自定义动画名"

使用说明：在需要添加动画效果的元素标签上填上animation-name属性，属性值为自定义的动画名称

 

animation-duration：时间

使用说明：动画持续的时间，属性值为时间单位

 

animation-timing-function：ease

使用说明：动画运行速度曲线，不太重要，非特殊需要取默认值即可

 

animation-delay：时间

使用说明：动画延迟运行时间。属性值为时间。规定动画在N秒之后再执行

 

animation-iteration-count ：数字

使用说明：规定动画播放的次数。默认动画播放次数是1

 

animation-direction：normal

使用说明：规定动画是否在下一周期逆向运行normal：正向，reverse：反向，alternate 先正向再反向。alternate-reverse：先反向再正向。

 

animation-play-strate：running

使用说明：规定动画运行状态，默认值为running，运行态

 

 

 

在css样式中定义动画：

@keyframes +自定义动画名称{

from{动画开始状态}，

to{动画结束状态}。

}