我有一些纯HTML的静态页面，当服务器宕机时显示。我怎么能把我做的favicon(它是16x16px，它在同一个目录下的HTML文件;它被称为favicon.ico)作为“标签”图标，因为它是?我已经在维基百科上阅读了一些教程，并已经实现了以下内容:
<link rel="icon" href="favicon.ico" type="image/x-icon"/>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
但它还是不能工作。我正在使用Chrome浏览器测试网站。根据维基百科，.ico是在所有浏览器类型上运行的最佳图片格式。
更新
我不能让这在本地工作，尽管代码检查出来，它将只有在服务器开始为网站服务时才能真正正常工作。只需尝试将其推到服务器并刷新您的缓存，它应该可以正常工作。
当前回答
如果您将favicon.ico添加到根/images文件夹中，浏览器将自动理解并将其作为favicon。我测试和工作。 你的链接必须是www.website.com/images/favicon.ico
更多信息请看这个答案:
你必须包括<链接rel="icon" href="favicon.ico" type="image/x-icon" />吗?
其他回答
根据OP的更新，它在本地没有显示，但根据OP的更新，一旦我上传到服务器，它就没事了。
由于这是一个简单的静态html网站，我可以在不运行本地web服务器的情况下使用它。 web服务器通常会自动提供图标，如果有一个，默认情况下。
但是当不运行web服务器时，浏览器本身不会读取目录寻找其他文件，比如favicon.ico，除非它列在html文档中。
所以，当我有以下项目在头部标签:
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
我也没有包括一个参考平原'ol favicon.ico。 尽管如此，除了上面列出的图像之外，还包括favicon.ico文件。
一旦我添加了以下一行:
<link rel="icon" type="image/x-icon" href="favicon.ico">
它也显示在我的浏览器，当我查看本地文件时，即使不是通过本地服务器提供它。
因此，当图标在活动服务器上运行时显示良好，但在本地不显示。
I mention this explicitly because the favicon generator I used, kindly supplied the code, icons, manifest, and instructions. However, while it included the favicon.ico image, it did not include a <link> to that file in the code to add to the html document. I guess that service presumes favicon.ico will automatically be served up and used by all browsers by default, so only the "alternate" versions needed to be explicitly added to the head tag. Evidently, they don't consider that when viewing files locally (aka not serving them up locally), we aren't interested in seeing the favicon?
<link rel="shortcut icon" type="image/ico" href="/favicon.ico"/>
<link rel="shortcut icon" type="image/ico" href="http://example.com/favicon.ico"/>
<link rel="shortcut icon" type="image/png" href="/favicon.png"/>
<link rel="shortcut icon" type="image/png" href="http://example.com/favicon.png"/>
请注意，FF无法在URL中加载冗余的//图标，如/img//favicon.png。在FF 53上测试。Chrome浏览器没问题。
<link rel="shortcut icon" type="image/png" href="/favicon.png"/>
<link rel="shortcut icon" type="image/ico" href="http://example.com/favicon.ico"/>
这对我很有效
注意，如果你的网站是作为子文件夹运行的，例如:
http://localhost/MySite/
你需要考虑到这一点。如果您从ASP中这样做。NETapp你所需要做的就是在URL前面加一个~:
<link rel="shortcut icon" type="image/x-icon" href="~/favicon.ico" />
