2023 年为您的网站提供 30 个免费的 CSS 加载动画

我们将使用 Lottie 文件
Lottie 文件 毫不费力地为网络、应用程序、社交和设计带来最小的、免费的、随时可用的动态图形。立即创建、编辑、测试、协作和发布 Lottie 动画！
脚步
1.在你的html中添加这个脚本

<script 
   src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js">
</script> 

2.我们将提供一个JSON文件链接，应该放在src属性中

<lottie-player 
 src="Place json file link" 
 background="transparent"  
 speed="1"  
 style="width: 300px; height: 300px;"  
 loop  
 autoplay>
</lottie-player>

如果你不想使用 Lottie Files 下载这些 Gif
1.纸飞机

JSON文件

https://assets4.lottiefiles.com/packages/lf20_x62chJ.json

2.物料波浪加载

JSON文件

https://assets8.lottiefiles.com/datafiles/nT4vnUFY9yay7QI/data.json

3.加载动画蓝色

JSON文件

https://assets6.lottiefiles.com/packages/lf20_usmfx6bp.json

4.加载

JSON文件

https://assets8.lottiefiles.com/datafiles/qm9uaAEoe13l3eQ/data.json

5.拖车装载

JSON文件

https://assets8.lottiefiles.com/datafiles/bNwYPnjv3OdFA5w/data.json

6.ServisHero加载

JSON文件

https://assets8.lottiefiles.com/datafiles/Hc0DflKIkYg1j3u/data.json

7.无限加载

JSON文件

https://assets1.lottiefiles.com/datafiles/LZyeA614QaESwNk/data.json

8.发光加载

JSON文件

https://assets2.lottiefiles.com/datafiles/WKqC5QWz9GiZnlm/data.json

9.加载

JSON文件

https://assets2.lottiefiles.com/datafiles/ORpUnaV6z0mJ17E/data.json

10.加载

JSON文件

https://assets7.lottiefiles.com/datafiles/XpFCWApEzLI29va/data.json

11.装箱

JSON文件

https://assets2.lottiefiles.com/packages/lf20_a2chheio.json

12.翻转盒加载

JSON文件

https://assets2.lottiefiles.com/packages/lf20_Z4BhGL.json

13.三角加载

JSON文件

https://assets2.lottiefiles.com/datafiles/DlRM2jtACyr4IX1u6l5rqtW1QWZKLCkNoBIXWeyH/loading.json

14.手指点击加载

JSON文件

https://assets2.lottiefiles.com/packages/lf20_szlepvdh.json

15.简单加载

JSON文件

https://assets2.lottiefiles.com/datafiles/tvGrhGYaLS0VjreZ1oqQpeFYPn4xPO625FsUAsp8/simple loading/simple.json

16.装书

JSON文件

https://assets2.lottiefiles.com/datafiles/kdNSsX7MXeXXT1u/data.json

17.加载齿轮
JSON文件

https://assets2.lottiefiles.com/datafiles/jQOi6i5dHOY4uP3/data.json

18.加载成功微调器

JSON文件

https://assets2.lottiefiles.com/packages/lf20_knpXLX.json

19.加载动画

JSON文件

https://assets2.lottiefiles.com/datafiles/kaSuzs8QVBUsk3j/data.json

20.装书

JSON文件

https://assets5.lottiefiles.com/packages/lf20_DMgKk1.json

21.加载模式

JSON文件

https://assets3.lottiefiles.com/packages/lf20_TEPYi7OqQu.json

22.加载!

JSON文件

https://assets2.lottiefiles.com/packages/lf20_pMMQPe.json

23液体负载胺依达拉替普

23液体负载胺依达拉替普

JSON文件

https://assets2.lottiefiles.com/packages/lf20_qg4cSS.json

24.流体加载动画

JSON文件

https://assets2.lottiefiles.com/datafiles/iTvqbURmiPR4l5L/data.json

25.加载

JSON文件

https://assets2.lottiefiles.com/temp/lf20_jIG9zu.json

26.加载 Bloob

JSON文件

https://assets2.lottiefiles.com/packages/lf20_rPGSco.json

27.加载

JSON文件

https://assets2.lottiefiles.com/datafiles/kn5W819UTw4eDwEBTOscVxDtsBaRzRSLnlqWen3o/Loading/data.json

28. HMS装载

JSON文件

https://assets2.lottiefiles.com/packages/lf20_t9gkkhz4.json

29. StreetBy 加载
    

JSON文件

https://assets2.lottiefiles.com/datafiles/afw92jL6nC0SZCb/data.json

30. 3D旋转加载动画
    
    JSON文件

https://assets2.lottiefiles.com/datafiles/wFjFleaESNWBzrV/data.json

制作不容易，喜欢的记得评论点赞分享。制作时间5/3 凌晨2点01分，困了睡觉。