Question

Chrome-“源代码”标签-我在控制台中看到以下内容：

在head标记内，我具有以下内容：

<link href='ico/favicon.ico' rel='icon'>

点击上面的链接-使用ico图像打开一个新标签。

也尝试过-没有成功：

<link rel="shortcut icon" href="ico/favicon.ico">

点击上面的链接说-不存在。

我还注意到错误消息仅在开始和按Ctrl F5之后出现，并且仅按F5之后才出现-它消失了。

无论如何，无论如何浏览器的选项卡上都没有图标。

“页面”标签上-控制台为空。

未经测试的其他浏览器。

那么拥有图标的正确方法是什么，以及如何避免出现上述消息？

Answer 1

通过转到http://localhost/ico/favicon.ico

确保您的收藏夹图标确实存在

然后尝试ctrl + f5，有时缓存会破坏事情。

Answer 2

TL； DR

您应该尝试的事情：

使用Firefox测试。如果可行，则您的body中可能只有head标记。
使用绝对路径（即/ico/favicon.ico）

说明

浏览器尝试按照约定在根目录中获得favicon.ico。因此，开发控制台中的这一行不并不表示您的浏览器不了解ico/favicon.ico。这更多表明favicon标记由于任何原因均无效，因此您的浏览器使用“根文件夹约定”作为后备。

使用绝对路径（即/ico/favicon.ico而不是ico/favicon.ico）可以帮助您查明问题，尤其是在测试页面不是/的情况下。

Chrome对于head中的禁止标记（例如div，p ...仅是body标记）具有特殊的行为。发生这种情况时，它将认为head节已关闭，因此忽略了所有仅head的标记...，例如link。结果：收藏夹图标有时可在所有地方使用，但在Chrome上无法运行。因此，在另一个浏览器上进行测试是一个好主意。如果收藏夹图标在其他地方起作用，请仔细查看您的head并尝试找出不应在此处的标记。 W3C验证程序可能会有所帮助。

Answer 3

正如菲利普（Philippe）所说，请检查您的头部标签是否没有错。就我而言，我正在使用echo函数（php代码）打印一个值。删除它可以解决此问题。

Answer 4

我在运行 Linux 的网络服务器上遇到过这样的问题。有时您需要在 favicon.ico 文件上设置执行位：

chmod +rx favicon.ico

我还必须向文件授予 Web 服务器服务/帐户的权限：

sudo chown www-data:www-data /var/www/favicon.ico

favicon.ico 404（未找到）

4 个答案: