第一步:声明动画方法
@keyframes rotation{
0%{
transform:rotate(0deg);
}
100%{
transform:rotate(360deg);
}
}
1.@keyframes 是声明动画方法的关键字
2.rotation 声明的方法名称
3.0%,%100
4.transform:first (0deg); 初始的角度
5.transform:last (360deg); 完整一个周期将结束的角度
6.0-360是顺时针;360-0是逆时针。
第二步:调用动画方法
animation: rotation linear 5s infinite;
1.animation 是调用的关键字
2.rotation 方法名称
3.linear 动画模式(匀速)
4.5s 动画一周期的时间
5.infinite 是动画无限循环