动画

• animation-name：代表关键帧的名字
• 关键帧：

@keyframes animiationName{
        keyframes-selector{
            css-style;
        }
}

• animation-duration：一个动画周期的时长
• animation-timing-function：作用于一个关键帧周期而非整个动画周期
• animation-delay：代表动画的延迟（这是一个动画外的属性）
• animation-iteration-count：循环关键帧的次数！（只会管理动画内的属性，动画的延迟不会被循环）
• animation-direction：改变关键帧的执行方向，还会影响animation-timing-function的形式
• animation-fill-mode：管理所有动画外的状态！
  • none : 动画外的状态保持在动画之前的位置
  • backwards ：from之前的状态与from的状态保持一致
  • forwards ：to之后的状态与to的状态保持一致
  • both ：动画外的状态与from和to的状态保持一致
• animation-play-state：管理动画的运行和停止