如何给你的网站加上favicon.ico图标

favicon.ico图标是网站的缩略标志,可以显示在浏览器标签、地址栏左边和收藏夹,是展示网站个性的缩略logo标志,也可以说是网站头像,如果要让网站看起来更专业、更美、更有个性,favicon.ico是必不可少的,所以你在本站使用ICO图标转换工具就可以轻松达到你的要求。

如何给你的网站加上favicon.ico图标:[1]
如何给你的网站加上favicon.ico图标:[1]

工具/原料

  • 一张你喜欢的logo方形图片

  • 一个在线制作工具aTool

方法/步骤

  1. 1

    准备一张长宽一样的图片,jpg,png,bmp均可,如果尺寸不一样大,可以采用windows系统自带的绘图工具剪裁即可。编辑之后保存为jpg,png,bmp格式的其中一个。

    如何给你的网站加上favicon.ico图标_第1张图片
  2. 2

    打开在线工具aTool(http://www.atool.org/ico.php)生成ico图标

    如何给你的网站加上favicon.ico图标_第2张图片
  3. 3

    点击选择文件,可以浏览你刚刚生成的宽高相同的图片。

    如何给你的网站加上favicon.ico图标_第3张图片
    如何给你的网站加上favicon.ico图标_第4张图片
  4. 4

    选择生成的图片尺寸大小,建议采用32*32的大小。点击“生成favicon.ico图标”按钮,即可生成。

    如何给你的网站加上favicon.ico图标_第5张图片
  5. 5

    点击“保存”链接即可将图片另存到本地磁盘。然后将文件重命名为favicon.ico。放到网站的根目录,强烈建议放在根目录

  6. 6

    然后在网站的每一个页面的head标签内加入两行代码。

    <head>

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

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

    </head>

    如何给你的网站加上favicon.ico图标_第6张图片
  7. 7

    清空浏览器缓存,刷新网页网址即可看到网站的图标。

    END

注意事项

  • 在线转换之前一定要转换成长宽相等的图片,不然转换成ico之后,图片会被拉伸或者压缩。

  • 在网站的每一个页面的head标签内记得加入两行引用ico的代码

你可能感兴趣的:(favicon.ico,atool)