瀏覽器地址欄和標題欄顯示的小圖標



ICO圖標的製作

第一步,簡單的ICO圖標只需要一張圖片,JPG、PNG、GIF都可以。可以用GIF就意味着你還可以做個有動畫效果的高級圖標O(∩_∩)O,不過不推薦這麼做,因爲GIF動畫文件比較大,會延遲頁面加載速度。【注意】圖片必須爲16px * 16px大小。

第二步,使用網上在線圖標轉換的服務,將圖片文件轉換爲ICO圖標。比如:http://free.logomaker.cn/tools/icoMaker.aspxhttp://free.logomaker.cn/tools/icoMaker.aspx【注意】IE同志的要求比較高,自己把後綴名改爲ico的做法,他是不承認滴,這個蛋疼的問題曾讓我糾結了很久。

在地址欄顯示你的圖標

將轉換好的ICO文件複製到你的網站文件夾根目錄下。如果你的網站只使用一個默認的圖標,那麼就將它命名爲favicon.ico,命名爲網站域名的名稱也可以(舉例,域名爲www.google.com,則命名爲google.ico即可)。一般瀏覽器會默認讀取該文件。有些國內瀏覽器如360等不顯示是因爲瀏覽器設置禁止了顯示圖標的功能。

如果某頁面有特殊要求呢?那麼就在頁面head標籤內部加入以下代碼:

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

上面代碼是控制地址欄圖標的,如果想要在用戶加入收藏夾時也顯示該圖標,就加入以下代碼:

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


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章