Font Awesome 提供了多种与加载或等待状态相关的图标,适用于表示加载、旋转、等待等状态。以下是一些常见的加载中图标及其用法:
常见加载中图标
- 旋转加载中(Circle Loading):
<i class="fas fa-sync fa-spin"></i>
- 旋转箭头(Spinner):
<i class="fas fa-spinner fa-spin"></i>
- 圆形进度条(Circle Progress):
<i class="fas fa-circle-notch fa-spin"></i>
- 环形进度条(Circle Progress Alternative):
<i class="fas fa-cog fa-spin"></i>
- 刷新(Refresh):
<i class="fas fa-redo-alt fa-spin"></i>
- 小齿轮旋转(Gear Rotation):
<i class="fas fa-cogs fa-spin"></i>
如何使用
- 在 HTML 文件中引入 Font Awesome CDN:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
- 使用加载中图标类:
<i class="fas fa-spinner fa-spin"></i> <!-- 旋转的加载图标 -->
fa-spin
类会让图标持续旋转,表示加载或等待的状态。
查看完整图标库
你可以在 Font Awesome 官网查看所有与加载中相关的图标:Font Awesome Icons – Loading
如果你有其他图标需求或其他问题,随时告诉我!
发表回复