css 图标旋转中

最新推荐文章于 2022-06-08 23:36:25 发布

转载最新推荐文章于 2022-06-08 23:36:25 发布 · 89 阅读

本文介绍了一种使用纯CSS实现的加载图标动画效果。通过关键帧动画(@-webkit-keyframes)，定义了从初始状态到结束状态的旋转动画，实现了流畅的旋转效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

.person-loading .loading-icon{position: absolute;top: 14px;}
i.loading-icon{width: 15px;
height: 15px;
background-position: 0 -90px;
-webkit-animation: loading 1s linear infinite;}

@-webkit-keyframes loading { 
from { -webkit-transform: rotate(0deg) translateZ(0); }
 to { -webkit-transform: rotate(360deg) translateZ(0); } 
}