我有一些纯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是在所有浏览器类型上运行的最佳图片格式。

更新

我不能让这在本地工作,尽管代码检查出来,它将只有在服务器开始为网站服务时才能真正正常工作。只需尝试将其推到服务器并刷新您的缓存,它应该可以正常工作。


当前回答

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

这对我很有效

其他回答

我知道这是一个老帖子,但仍然为像我这样的人发帖。 这对我很有效

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

把你的favicon图标放在根目录..

尝试使用<link rel="icon" type="image/ico" href="images/favi.ico"/>

如果favicon是png类型的图片,在旧版本的Chrome中行不通。然而,它在FireFox中工作得很好。此外,在处理这些事情时,不要忘记清除浏览器缓存。很多时候,代码很好,但缓存才是真正的罪魁祸首。

大多数浏览器会从站点的根目录中获取favicon.ico,而不需要被告知;但他们并不总是立即更新一个新的。

然而,我通常会选择你的第二个例子:

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

正如W3.org所推荐的,您可以使用rel属性来实现这一点。

例子:

<head>
<link rel="icon" 
      type="image/png" 
      href="http://example.com/myicon.png">
...