【问题标题】：Yet Another "Why isn't my Favicon showing?"另一个“为什么我的 Favicon 没有显示？”
【发布时间】：2012-07-03 20:57:50
【问题描述】：

更新

我刚刚尝试再次将我的网站“固定”到任务栏（删除它之后），但是当我单击并按住地址栏内 16x16px 图标上的鼠标按钮时（见下图），你可以看到我的网站图标被拖动了用鼠标 - 所以 Internet Explorer 找到并得到了图标 - 它只是没有在所有正确的地方显示它！还更新了以下代码：

正如标题所示，我无法显示我的网站图标；在任何浏览器的任何版本中。不过有 1 个例外 - 这还不够好：

IE 9 和 IE 10 -

正如您在上面的屏幕截图中可能看到的那样，唯一我看到我的图标是在我将它添加到我的收藏夹并打开收藏栏之后。 favicon not 显示在选项卡中（页面标题旁边），它不显示在任务栏区域，如果我有“将我的网站固定到任务栏。

在其他所有浏览器中，它根本不显示。

我已经尝试了所有可以在网上找到的“解决方案”。

这是我的代码：

    <link rel="icon" type="image/x-icon" href="http://www.mysite.com/favicon.ico"><!-- Major Browsers -->
    <!--[if IE]><link rel="shortcut icon" href="http://www.mysite.com/favicon.ico"/><![endif]--><!-- Internet Explorer-->

我还尝试了所有常见的图标大小； 16x16、32x32、64x64、128x128 和 256x256 - 我什至尝试将所有尺寸保存在同一个 *.ico 文件中。

我已尝试删除 *.ico 文件的缓存文件。

没有任何效果。完全相同的代码以前在我制作的其他网站上工作过。我不明白。什么给了？

【问题讨论】：

标签： html internet-explorer google-chrome icons favicon

【解决方案1】：

我已经编辑了这个答案，只留下了有问题的问题的解决方案。

使用：<link rel="shortcut icon" href="{ICONURL}"/>

代替：<link rel="icon" href="{ICONURL}"/>

【讨论】：

谢谢。那是我试过但忘了提及的另一个，对不起。我在尝试 ico 后尝试了 PNG，但它们都不起作用。但是，我刚刚发现了一些非常非常奇怪的东西（请参阅更新的问题）
在每个浏览器中将 rel="icon" 替换为 rel="shortcut icon"，而不仅仅是 IE。
是的，*.png 文件也可以，正如 poepje 所说；这是我在阅读一篇文章说浏览器现在支持 PNG“图标”文件后在其他网站上使用的内容
太棒了！您的评论解决了我的问题，@djmati11 - 非常感谢！我很惊讶有多少文章和教程包含错误的信息或只是过时的信息，这会让事情变得非常混乱。

【解决方案2】：

刚才我的网站也遇到了同样的问题。让自己疯狂地试图让 favicon.ico 文件正常工作。最终让它在 IE 11（在 Windows 7 上）中为我正常工作的是完全转储 favicon.ico 文件并使用 PNG 代替：

<link rel="shortcut icon" href="/favicon-32x32.png" type="image/png"/>

我使用了一个带有透明层的 PNG 文件。一旦我这样做并上传了我的页面，IE 就会在下一页刷新时开始在选项卡（和快捷方式/书签）中正确显示图标。我仔细检查了一下，看起来 Chrome 和 Firefox 也很酷。

【讨论】：

【解决方案3】：

我用

<link rel="icon"
      type="image/ico"
      href="Link Goes Here">

如果将网站图标放在文件夹中：

<link rel="icon"
      type="image/ico"
      herf="Folder/Subfolder"

确保代码在 head 标签中。确保图像为 .ico 格式；否则将无法正常工作。

【讨论】：