CSS动画基本知识点总结（一）

过渡transition：

原理：当指定元素存在属性变换时，增加过渡效果。（比如给hover事件）
最少2个值：1、要添加的CSS属性过渡效果，2、指定效果的持续事件
transition(简写): ①该元素身上的过渡效果CSS ②过渡时间 ③过渡效果的时间曲线 ④过渡效果何时开始

关键帧@keyframes

@keyframes 规则是创建动画
@keyframes 规则内指定一个 CSS 样式和动画将逐步从目前的样式更改为新的样式（关键帧）
①需要规定一个关键帧名称@keyframes name
②需要设置动画 form{0%} to{100%} 规定从一种样式到另一种样式的效果。
最佳使用：用百分比来规定变化发生的时间:0%-100%，之间可以是任意多的变化次数，也可以倒放100%-0%

动画animation

在元素选择器中匹配动画animation:
①匹配关键帧@keyframes创建的动画名称
②动画时间：秒或者毫秒
③动画效果的时间曲线：linear匀速，ease慢快慢
④动画效果何时开始：秒或者毫秒
⑤动画的播放次数：次数n,或者infinite 无限次
⑥规定动画是否轮流反向播放动画：正序,倒序,交替播放
⑦规定动画不播放时的样式：保持第一帧或最后一帧的样式
⑧ 指定动画是否正在运行或已暂停