@keyframes—定义动画关键帧

@keyframes用来定义动画名和关键帧，其语法规则如下

@keyframes run {
    0% {
        //有动画性质的属性的改变情况
    }
    25% {
    }
    50% {
    }
    75% {
    }
    100% {
    }
}

即将动画执行的过程分为若干段，在每一段中定义该段中最后一帧的元素的状态

【注】

1.其百分比必须从0%-100%，表示元素运动的第一帧到最后一帧（不要忘了百分号）

2.0%和100%分别可以用from和to代替

3.每段动画执行的时间按照关键帧分配的比例在总时间内划分，比如动画执行总时间为4s，则0%-25%这一过程占用1s

---

@keyframe与animation配合使用， 因此下一节再举例子吧