在html 標籤添加圖標，網頁title左邊顯示網頁的logo圖標

時間 2019-11-08

標籤 html 標籤添加圖標網頁 title 左邊顯示 logo 欄目 HTML 简体版

原文原文鏈接

如圖在黑色所畫圓之中顯示一個圖標：html

步驟一：在圖片中顯示圖標，這裏的圖片只支持ico格式，須要轉換圖片格式.
原始圖像能夠接受: .jpg .jpeg .gif .png等圖像格式
在這個網址http://www.bitbug.net/上傳你的原始圖片而後生成ico格式圖標(百度ico能夠找到製做ico圖標的網站)；
注意：圖標要用 16*16 色的。。。(保證了兼容性，不管在哪一個地方均可以顯示)瀏覽器

步驟二：把圖標放到網站根目錄
在<head></head>引入圖標
網頁標題左側顯示：<link rel="icon" href="圖標地址" type="image/x-icon">
收藏夾顯示圖標：<link rel="shortcut icon" href="圖標地址" type="image/x-icon">工具

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>一個有夢想鹹鴨蛋</title>
        <!--網頁標題左側顯示-->
        <link rel="icon" href="1111.ico" type="image/x-icon">
        <!--收藏夾顯示圖標-->
        <link rel="shortcut icon" href="1111.ico" type="image/x-icon">
    </head>
    <body>
        
    </body>
</html>

建議把生成的圖標名稱改掉，在引用；如生成後是bitbug_favicon.ico改成你起的名字.ico
若是沒有生效關閉瀏覽器從新打開；網站