389节---------5月5日-----PC端完结

CSS动画

动画的基本使用

分为两步：

• 先定义动画
• 再使用（调用）动画

用keyfremes定义动画（类似定义类选择器）

语法：

@keyframes 动画名称 {

    0%{
            width：100Px;
      }

    100%{
             width：200px;
      }
      
}

注意：

• 0%是动画的开始，100%是动画的完成。这样的规则就是动画序列。
• 在@keyframes中规定某项CSS样式，就能创建由当前样式逐渐改为新样式的动画效果
• 动画是使元素从一种样式逐渐变化为另一种样式的效果。可以改变任意样式任意多的次数
• 适用百分比来规定变化发生的时间，或者用关键词“from”和“to”,等同于0%和100%

调用动画

animation-name：动画名称；
animation-duration：持续时间；

动画常用属性

• @keyframes                           规定动画。
• animation                                所有动画属性的简写属性,除了animation-play-state属性。
• animation-name                      规定@keyframes动画的名称。（必须写)
• animation-durat