我一直在做一个网站，我想在浏览器选项卡上添加一个小图标。
我怎么能在HTML中做到这一点，在代码的哪里，我需要把它(例如头)?我有一个。png徽标文件，我想转换为一个图标。
相关:HTML设置图像浏览器选项卡。
当前回答
对于Chrome浏览器显示页面图标(favicon)，您需要从托管服务器检查您的网站，或者您可以在PC上开发和测试您的网站时使用本地主机。
其他回答
通过在Apache的.htaccess文件[或Nginx的等效文件]中重命名/翻译每个HTTP请求，你可以让~所有浏览器发现一个favicon.png文件，如下所示:
# Universal favicon
RewriteRule ^(?:fav|apple-touch-)icon.*\.(?:ico|png)$ favicon.png [L]
然后，你唯一需要做的就是将这一行添加到HTML代码的头部部分:
<link rel="icon" href="favicon.png">
关于图像尺寸，我会使用我的webapp所期望的最高尺寸(例如Android的192px)，让剩余的尺寸由用户代理自动向下采样(这在现代视网膜设备中不应该是问题)。
实际上有两种方法可以在网站上添加图标。
< =“icon”铁路链接>
只需将以下代码添加到<head>元素中:
<link rel="icon" href="http://example.com/favicon.png">
大多数浏览器都支持PNG格式的favicons，除了IE <= 10。为了向后兼容，您可以使用ICO favicons。
注意，你不再需要在rel属性的图标前面加上快捷键了。来自MDN链路类型:
快捷链接类型经常出现在图标之前，但这种链接类型是不符合要求的，被忽略了，web作者不能再使用它了。
根目录下的Favicon.ico
来自另一个SO答案(@mercator):
所有现代浏览器(在Chrome 4、Firefox 3.5、IE8、Opera 10和Safari 4上进行了测试)总是会请求favicon.ico，除非你通过<link>指定了一个快捷图标。
你所要做的就是让/favicon。ico请求返回你的favicon。不幸的是，这个选项不允许你使用PNG图标。
另见favicon.png vs favicon.ico -为什么我应该使用PNG而不是ICO?
我没有用过其他的，但https://realfavicongenerator.net/似乎是首选，这里还没有提到它。
它支持svg作为生成favicons的源图像，并提供了用于覆盖不同平台的图像的有用选项。此外，默认情况下，它不会生成大量的图像来向后兼容每个过时的平台。相反，它提供了一些选项来检查是否需要它们。
从开发者发给我的邮件来看，他们还计划增加对生成SVG favicons的支持，以及SVG主题敏感性，我认为这是一个非常棒的功能。
上面有很多复杂的解决方案。给我吗?在将图像大小更改为32 x 32像素后，我使用GIMP保存了原始PNG文件的副本。
只是要确保将其保存为*.ico文件并使用
<link rel="shortcut icon" href="http://sstatic.net/stackoverflow/img/favicon.ico">
上面列出的
使用工具将png转换为ico文件。你可以搜索“favicon生成器”，你可以找到许多在线工具。 将ico地址与链接标签放在头部: <link rel="快捷图标" href="http://sstatic.net/stackoverflow/img/favicon.ico">
