css3动画快速旋转 |css text 省率

.rotate {
animation-name: spin;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}

上面的代码使用了CSS3动画的关键帧（@keyframes）和动画属性（animation），实现了一个无限循环的快速旋转效果。

通过给元素加上.rotate类名，就可以让它自动旋转起来。

动画的具体效果可以通过设置不同的属性值来调整，比如duration控制动画的时长，timing-function控制动画的速度曲线，iteration-count控制动画的循环次数。

值得注意的是，CSS3动画只对支持的浏览器生效，老的浏览器如IE9及以下不支持，可以考虑使用JavaScript动画库来实现类似的效果。

总之，CSS3动画是网页制作中的一项强大工具，熟练掌握它可以让你的页面更加生动有趣。