1、语法：
    1、先定义动画
    @keyframes 动画名称 {
    0% 或者 from{
    css样式
    }
    …
    100% 或者 to{
    css样式
    }
    }
    2、调用动画（简写方式）
    animation:name duration timing-function delay interation-count direction;
    2、动画其他属性：
    animation-name 动画的名称
    animation-duration 动画完成一个周期所花费的时间。默认是0秒
    animation-timing-function 动画的速度曲线。默认是 “ease”
    linear 匀速
    ease 默认。动画以低速开始，然后加快，在结束前变慢
    ease-in 动画以低速开始
    ease-out 动画以低速结束
    ease-in-out 动画以低速开始和结束
    animation-delay 动画延迟时间，即何时开始。默认是0。
    animation-interation-count 动画被播放的次数。默认是 1，值为infinite表示播放无限次
    animation-direction 动画方向。默认是 “normal”
    normal 默认值。动画按正常播放
    reverse 动画反向播放
    alternate 动画在奇数次（1、3、5…）正向播放，在偶数次（2、4、6…）反向播放
    alternate-reverse 动画在奇数次（1、3、5…）反向播放，在偶数次（2、4、6…）正向播放
    animation-play-state 动画播放状态。有两个值，running和paused（暂停动画）
    animation-fill-mode forwards：表示动画在结束后继续应用最后关键帧的位置。
    3、举例：
    div{
    animation: move 3s linear 2s infinite alternate forwards;
    }
    div:hover{
    animation-play-state: paused; 鼠标悬浮时，暂停动画
    }