favicon.ico介紹

背景：今天在羣裏解決羣友問題時，對favicon瞭解不夠深入，錯誤了理解羣友的意思。實在慚愧，誤人子弟了。後來測試和整理，記錄一下

介紹

favicon是Favorites Icon的縮寫，代指的是一個網頁標題左側的圖標。擡頭看一下當前文章標題，左側的那個大C就是csdn的favicon.ico。

.ico是一種圖片格式，通常用於網頁圖標。
具體使用方法：

<!--這是當前csdn的使用方式-->
<link href="https://csdnimg.cn/public/favicon.ico" rel="SHORTCUT ICON">

狀態

今天主要是想說一下這個favicon.ico出現的幾種狀態。

不同瀏覽器實現不一樣，此處以chrome瀏覽器爲主，其他瀏覽器對此沒這麼多設計。
主要分爲三種狀態：

1. 剛加載頁面時，瀏覽器還沒請求到ico資源，所以當前圖標的位置會出現一個圈圈逆時針轉圈。
2. 請求到icon資源後，圖標位置會出現圖標樣式，如果當前還有其他資源的話，會出現以圖標爲底，有一個小圈圈順時針方向旋轉。
3. 當所有的資源都返回後，小圈圈消失，顯示完整的圖標。
   
   
   

參考：

• https://zhidao.baidu.com/question/489658691.html
• https://www.cnblogs.com/nyw1983/p/11222350.html