Html Favicons拒绝在IE和Chrome中显示

我正试图在HTML页面上包含一个favicon，我花了几个小时试图解决这个问题。favicon会出现在Firefox上，但不会出现在IE、Chrome或Edge上。我是从一个本地文件启动这个站点的（所以它不是托管在任何地方）

以下是我拥有的favicon的代码-这是唯一一个在Firefox中有效的代码：

<link rel="shortcut icon" type="image/png" href="/favicon-32x32.png?v=2"/>
<link rel="shortcut icon" type="image/png" href="/favicon-16x16.png?v=2"/>
<link rel="shortcut icon" href="favicon.ico?v=2" type="image/icon">
<link rel="icon" href="favicon.ico?v=2" type="image/icon">

作为参考，我尝试了以下问题的答案，但不幸的是，没有成功：

我尝试过的事情：

• 我已经在Chrome上清空了很多次缓存，但这一点都没有帮助

• 我还用favicon替换了一个不同的图像，它在这个页面上不起作用，尽管favicon肯定在另一个完全独立的页面上起作用

• 删除“href”中前面的斜杠，但这也不起作用

• 将“href”更改为指向“我的下载”文件夹，如中的建议

• 正如在上述链接问题的公认答案中所建议的，我已经将图标引用更改为
  ，以查看是否显示StackOverflow图标-同样，Chrome没有显示任何内容，但有趣的是，Firefox也没有显示任何内容

---

我应该提到的另一件事是favicon都存储在根文件夹中，因此没有URL问题

这似乎是Chrome上本地托管站点的一个bug

我从中找到了部分解决方案。我发现，如果我使用JQuery设置favicon，那么无论它是否是本地文件，它都会显示在Chrome（和Firefox）上。代码如下：

var link = document.createElement('link');
link.type = 'image/x-icon';
link.rel = 'shortcut icon';
link.href = 'http://www.stackoverflow.com/favicon.ico';
document.getElementsByTagName('head')[0].appendChild(link);

---

也许问题出在图标本身？@AhmadAlfy我也有这个想法，所以我尝试在另一个完全独立的页面中使用图标，结果成功了。我还试过替换那个页面上的图标（我知道在Chrome中很好用），但它没有出现在这个页面上，所以代码肯定有问题，你在哪里尝试过将它们安装到最小的apache中并在那里进行测试？@JeffreyColeman我不知道怎么做，但我会调查的-谢谢你的建议！如果您使用的是eclipse，那么有一个向导可以创建一个简单的http服务器，这对我来说似乎是最合理的解释！差一点就解决了（虽然还没打球，但这是意料之中的事！）。我已经在下面发布了我的答案，但您的答案实际上更好地回答了这个问题，因此我将其保留为已接受；）再次感谢你的帮助！