animation
动画:
通过设置多个节点来控制一组动画自动播放。
-
动画用关键帧
@keyframes
定义; -
再用
animation
调用。
@keyframes
(关键帧)
@keyframes 动画名称 { from { /*动画的开始*/ } to { /*动画的完成*/ } }
@keyframes 动画名称 { 0% { /*动画的开始*/ } 100% { /*动画的完成*/ } }
0%或者’from‘就是动画的开始;
100%或者‘to’就是动画的结束。
以上就是定义动画的两种方式。
@keyframes move {
0% {
transform: translate(0);
}
50% {
transform: translateY(100px);
}
100% {
transform: