transition和动画

transition: 指定属性 持续时间 变化规则 延迟时间

动画

@keyframes 动画名称{
    //方式一
     from{ 属性:属性值}
     to{属性:属性}
     //方式二  百分比
     0%{}
     25%{}
     50%{}
     75%{}
     100%{}
 }

• animation-name 名称
• animation-duration 持续时间
• animation-delay 延迟 负值是已经播放几秒
• animation-iteration-count 次数 infinite 无限啊循环
• animation-direction 方向
  normal 正常
  reverse 反向
  alternate 正向到反向循环
  alternate-reverse 反向到正向循环
• animation-timing-function 变化率
  linear 匀速
  ease 慢 快 慢
  ease-in 慢 快
  ease-out 快 慢
  ease-in-out 较慢 快 较慢
• animation-fill-mode 动画结束保存那一帧
  none 默认无
  fowards 保留最后一帧
  backwards 保留第一帧
  both ？
• animation-play-state 动画是否暂停
  paused
  running