扫描线匀速旋转掠过目标点，科技风加载动画
← 返回 加载 类特效列表上方为纯 CSS 实时演示，直接将鼠标移上去 / 点击感受效果
.fx .rdr{height:150px;display:flex;align-items:center;justify-content:center}
.fx .rdr .scr{position:relative;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,#0d2b3e,#06121e);overflow:hidden}
.fx .rdr .scr::before{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(74,158,255,.75),transparent 60deg);animation:kfx-spin 2.5s linear infinite}
.fx .rdr .dotr{position:absolute;width:8px;height:8px;border-radius:50%;background:#57ab5a;box-shadow:0 0 8px #57ab5a}
.fx .rdr .d1{top:20px;left:34px}
.fx .rdr .d2{bottom:26px;right:28px}
.fx .rdr .d3{top:56px;right:40px}
@keyframes kfx-spin{to{transform:rotate(360deg)}}<div class="fx">
<div class="rdr"><div class="scr"><div class="dotr d1"></div><div class="dotr d2"></div><div class="dotr d3"></div></div></div>
</div>