在html标签添加图标，网页title左边显示网页的logo图标

2019年9月7日 166次阅读 来源: 咸鸭蛋

《在html<title></title>标签添加图标，网页title左边显示网页的logo图标》” /></span></p><p>如图在黑色所画圆之中显示一个图标：</p><p>步骤一：在图片中显示图标，这里的图片只支持ico格式，需要转换图片格式.<br />原始图像可以接受: .jpg .jpeg .gif .png等图像格式<br />在这个网址<a href=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
如果没有生效关闭浏览器重新打开；

《在html<title></title>标签添加图标，网页title左边显示网页的logo图标》” /></span></p><p>怎么样获取别人的Logo</p><p>在网站首页 打开开发者工具；在Elements里<head></head>里找到<br /><link rel=”icon” href=”图标名称.ico” type=”image/x-icon”></p><p><span><img layer-src=     原文作者：咸鸭蛋
    原文地址: https://segmentfault.com/a/1190000008916785
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。

点赞