我們都知道我們可以寫一段html來把瀏覽器的地址欄圖標替換成自己網站的圖標,但是你知道在不同你瀏覽器下顯示不同icon圖標的方法嗎?尤其是在Firefox下還能顯示動態的地址欄icon圖標呢!下面icech就為大家講解一下如何設置不同瀏覽器下不同的地址欄icon圖標。
1、普通方式下的地址欄icon圖標替換
方法1:制作一個ico圖標,然后重命名為favicon.ico,將這個icon圖標文件上傳至網站的根目錄下就可以了。
說明:這種方法適用于各種瀏覽器的地址欄icon圖標和收藏夾圖標。
方法2:在網頁的head中加入以下代碼:
IE或者Firefox地址欄前換成自己的圖標
< link rel="icon" href="favicon.ico" type="image/x-icon">
< link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon">

可以在收藏夾中顯示出你的圖標
< link rel="Bookmark" href="favicon.ico" type="image/x-icon">
說明:這種方式適用于IE瀏覽器。
2、在Firefox下顯示動態的icon圖標
首先制作出一個大小為16×16像素的gif圖片,文件名沒有要求。然后上傳到icon目錄下(任意目錄都可以),然后在head中加入代碼:
< link rel="icon" href="icon/animated_favicon.gif" type="image/gif">
這樣在Firefox瀏覽器下就能在地址欄中顯示動態的icon圖標了!但是這種方式不能再IE中顯示動態效果。

所以同時使用兩個代碼,就可以同時在IE和Firefox瀏覽器的地址欄下顯示不同的icon圖標了。在不同瀏覽器下地址欄ico圖標顯示效果可以點擊這里查看到。
代碼如下:
< link rel="icon" href="favicon.ico" type="image/x-icon">
< link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon">
< link rel="icon" href="icon/animated_favicon.gif" type="image/gif">
注意:不論是icon格式還是gif格式的圖標,大小都應該是16×16像素。代碼“< link”中icech加了一個空格,使用的時候要注意去掉空格。
聲明:本文為西部e網原創,轉載請注明來源。
