如何为网站添加浏览器选项卡图标（favicon）？

我一直在做一个网站，我想在浏览器选项卡上添加一个小图标。

我如何在 HTML 中执行此操作以及我需要将其放置在代码中的什么位置（例如标题）？我有一个 .png 徽标文件，我想将其转换为图标。

原文由 knookie 发布，翻译遵循 CC BY-SA 4.0 许可协议

阅读 996

实际上有两种方法可以将网站图标添加到网站。

`<link rel="icon">`

只需将以下代码添加到 <head> 元素：

 <link rel="icon" href="http://example.com/favicon.png">

请注意，您 不必再在 rel icon 之前加上 shortcut 。来自 MDN 链接类型：

shortcut 链接类型在 icon 之前经常看到，但这种链接类型是不合格的，被忽略了， 网络作者不得再使用它了。

所有现代浏览器（使用 Chrome 4、Firefox 3.5、IE8、Opera 10 和 Safari 4 测试）将始终请求 favicon.ico 除非您通过 <link> 指定了快捷方式图标。

因此，您所要做的就是向您的网站发出 /favicon.ico 请求，返回您的网站图标。遗憾的是，此选项不允许您使用 PNG 图标。

原文由 Michał Perłakowski 发布，翻译遵循 CC BY-SA 3.0 许可协议