1. 程式人生 > >設定favicon的幾種方式

設定favicon的幾種方式

favicon.ico設定的幾種方式

第一種方法:放在根目錄
這種方法最簡單,在伺服器根目錄下放一個 favicon.ico 的檔案,瀏覽器發現後就會使用。

第二種方法:link標籤
在head裡面加入程式碼:

     <link rel="shortcut icon" href="ico檔案url">

第一種方法設定的是全站的,第二種方法可以針對某個網頁單獨設定ico。
補充介紹:
如果你只是為了解決方案,看完上面你就可以去用了,想稍微瞭解下相關資訊,請繼續看。

什麼是Favicon?Favicon是Favorites Icon的縮寫,favicon.ico是指顯示在瀏覽器收藏夾和位址列網站網址前面的個性化圖示,常被成為網頁小圖示、網站縮圖標或者收藏夾圖示,是網站的重要識別方式。

位址列上的小圖示:

百度favicon 納蘭雪Blog favicon

收藏夾上的小圖示:

收藏夾favicon

favicon的格式不一定是ico格式,它可以是png,jpg甚至是gif,不過ico格式是所有瀏覽器都支援的。

favicon.ico的尺寸有16×16、32×32、48×48,在新增到桌面、工作列小尺寸的圖示就不是很理想了,這就需要多種尺寸相容各種裝置和情況。想深入瞭解的戳這裡《教你製作完美的FAVICON圖示》。

第二種方法有兩種語法,對比如下:

    <link rel="shortcut icon" href="../favicon.ico">

    <link rel="icon" href="../favicon.ico">

icon的link還有個type屬性,指定檔案的型別為icon。

    <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">

第二種方法的檔名不一定是要favicon了,可以任意命名。

無論何種情況,都請在根目錄下放一個favicon.ico的圖示,Web伺服器都會請求favicon.ico這個檔案,如何不存在會產生404錯誤,並且記錄到錯誤日誌中,這完全是可以避免的。