FontAwesome動態旋轉圖標類（fa-spin&fa-pulse）
一、總結
一句話總結：
fa-spin類：將"fa-spinner"這個圖標旋轉起來，形成一個連續流暢的旋轉動畫效果。
fa-pulse類：將"fa-spinner"這個圖標以八步為周期旋轉起來，形成一個不太流暢的旋轉動畫效果。
二、FontAwesome動態旋轉圖標類（fa-spin&fa-pulse）
轉自或參考：FontAwesome動態旋轉圖標類（fa-spin&fa-pulse）_網絡_SkeletonKing233的博客-CSDN博客
https://blog.csdn.net/SkeletonKing233/java/article/details/99731513
不管是我們在網上打游戲，還是上網學習的時候，網頁在加載時往往都會出現一個不停在轉着圈的加載圖標，可是這種圖標是怎么實現的呢？其中一種方法就是用FontAwesome圖標提供的兩個很不錯的類——fa-spin和fa-pulse。
fa-spin類
<i class="fa fa-spinner fa-spin"></i>
功能：將"fa-spinner"這個圖標旋轉起來，形成一個連續流暢的旋轉動畫效果。
fa-pulse類
<i class="fa fa-spinner fa-pulse"></i>
功能：將"fa-spinner"這個圖標以八步為周期旋轉起來，形成一個不太流暢的旋轉動畫效果。
運行實例
備注：fa-spin與fa-pulse的最大差別就在於fa-spin是讓圖表非常流暢的在旋轉，而fa-pulse是以8步為一個周期在旋轉，既每轉45度停一小下，顯得不那么流暢。
以下為代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>FontAwesome動態旋轉圖標</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<p>這是四個用fa-spin類實現的旋轉流暢的加載圖標</p>
<i class="fa fa-spinner fa-spin"></i>
<i class="fa fa-circle-o-notch fa-spin"></i>
<i class="fa fa-refresh fa-spin"></i>
<i class="fa fa-cog fa-spin"></i>
<p>這是四個用fa-pulse類實現的旋轉不太流暢的加載圖標</p>
<i class="fa fa-spinner fa-pulse"></i>
<i class="fa fa-circle-o-notch fa-pulse"></i>
<i class="fa fa-refresh fa-pulse"></i>
<i class="fa fa-cog fa-pulse"></i>
</body>
</html>