通过Transform与Animation，来探索CSS中的动态视觉效果
warning:
这篇文章距离上次修改已过191天，其中的内容可能已经有所变动。
/* 定义一个简单的动画，使元素旋转 */
@keyframes rotateAnimation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* 应用动画到具有.rotating类的元素上 */
.rotating {
animation: rotateAnimation 2s linear infinite;
}
/* 应用于需要旋转的元素 */
<div class="rotating">我会不停旋转</div>这段代码定义了一个名为rotateAnimation的关键帧动画，它让元素从0度旋转到360度。然后，.rotating类使用这个动画，并设置了动画的持续时间为2秒，线性的速度曲线，并且是无限循环的。最后，我们展示了如何在HTML元素上应用这个旋转类来创建一个无止境地旋转的动画效果。
评论已关闭