CSS3实现无限旋转动画特效
/* 定义一个无限旋转的动画 */
@keyframes infinite-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* 应用动画到具体的元素上，这里以 .icon 为例 */
.icon {
animation: infinite-spin 2s linear infinite;
/* 其他样式 */
}这段代码定义了一个名为 infinite-spin 的关键帧动画，它让元素从0度旋转到360度。然后，它将这个动画应用到类名为 .icon 的元素上，动画持续时间为2秒，线性变化，并且是无限次数旋转。这是一个简单而有效的CSS3动画实现方式，适用于创建旋转加载器或者其他需要不断旋转的图标。
评论已关闭