[html] 第73天 favicon.ico有什么作用？怎么在页面中引用？常用尺寸有哪些？可以修改后缀名吗？

[haizhilin]

第73天 favicon.ico有什么作用？怎么在页面中引用？常用尺寸有哪些？可以修改后缀名吗？

[dddw001]

作用：标签页左上角图标
引用：

尺寸： 16x16 32x32

[cheng]

作用：favicon 也叫收藏夹图标，我们经常从网页标签中看到这个图标，但它的作用往往不仅如此，favicon的存在能够让我们更加容易区分浏览器收藏夹中的内容。并且favicon 在一定程度上减轻服务器的流量带宽占用，一般为了提高网站的可用性，我们都会为自己的网站创建一个自定义的404错误文件，在这种情况下，如果网站没有相应的favicon.ico文件，每当有用户收藏网站/网页时， Web服务器都会调用这个自定义的404文件，并在网站的错误日志中记录。这显然是应该予以避免的。

引用方式：

尺寸：1616 3232

[引用]：https://segmentfault.com/a/1190000007764284

[ChasLui]

作用: 挖矿
参考: https://juejin.im/pin/5a88f2d96d6def49864b74f4

[censek]

• Favorites Icon，让浏览器的收藏夹中除显示相应的标题外，还以图标的方式区别不同的网站。
• 强烈推荐使用后缀名.ico，对浏览器的支持范围广，一个.ico文件可以同时满足多个尺寸的需求。
• 常用尺寸：1616 3232 48*48。
• 引用方法：
  • 将图片 favicon.ico 放到 static 文件夹下 (用 vue-cli 搭建的Vue项目)
  • 然后在 index.html 中添加：
    <link rel="shortcut icon" type="image/x-icon" href="static/favicon.ico">

https://blog.csdn.net/Bule_daze/article/details/102718508

[chenshijin1]

网站 favicon 图标

favicon.ico 一般用于作为缩略的网站标志，它显示在浏览器的地址栏或者标签上。目前主要的浏览器都支持 favicon.ico 图标。

1、制作favicon图标

• 把图标切成 png 图片
• 把 png 图片转换为 ico 图标，这需要借助于第三方转换网站，例如比特虫：http://www.bitbug.net/

2、使用favicon图标

• favicon图标放到网站根目录下
• HTML页面引入favicon图标

在html 页面里面的 元素之间引入代码

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

常用尺寸：16*16 32*32 48*48

作者：Jane_xxxxxy链接：https://juejin.cn/post/6855610710932586510

[MrZ]

作用：favicon 也叫收藏夹图标，我们经常从网页标签中看到这个图标，但它的作用往往不仅如此，favicon的存在能够让我们更加容易区分浏览器收藏夹中的内容。并且favicon 在一定程度上减轻服务器的流量带宽占用，一般为了提高网站的可用性，我们都会为自己的网站创建一个自定义的404错误文件，在这种情况下，如果网站没有相应的favicon.ico文件，每当有用户收藏网站/网页时， Web服务器都会调用这个自定义的404文件，并在网站的错误日志中记录。这显然是应该予以避免的。

引用方式：

尺寸：16_16 32_32

[引用]：https://segmentfault.com/a/1190000007764284