HTML favicon赢得'；在谷歌浏览器上看不到_Html_Google Chrome_Hyperlink_Favicon

HTML favicon赢得'；在谷歌浏览器上看不到

html google-chrome hyperlink

HTML favicon赢得'；在谷歌浏览器上看不到,html,google-chrome,hyperlink,favicon,Html,Google Chrome,Hyperlink,Favicon,我正在制作一个未发布的HTML页面。我想做的一件事是在标题旁边添加一个favicon。我使用的是谷歌chrome，我注意到其他网站的图标都出现在浏览器的互动程序旁边，但我试图显示的那个不会出现。“我的桌面”上名为“站点”的文件夹中的站点。代码如下： <!DOCTYPE html> <html> <head> <title></title> <link rel="shortcut icon"

我正在制作一个未发布的HTML页面。我想做的一件事是在标题旁边添加一个favicon。我使用的是谷歌chrome，我注意到其他网站的图标都出现在浏览器的互动程序旁边，但我试图显示的那个不会出现。“我的桌面”上名为“站点”的文件夹中的站点。代码如下：

<!DOCTYPE html>
<html> 
    <head>
        <title></title>
        <link rel="shortcut icon" href="/favicon.ico" />
    </head>
    <body>
    </body>
</html>

由于您的href中有一个前导的

，因此您引用的文件将位于根文件夹中。如果您的页面位于计算机上的某个文件夹中，而不是从本地Web服务器为其提供服务，则前导的

将告诉浏览器查看文件系统的根文件夹。因此，浏览器希望文件位于

C:/favicon.ico

或类似位置，这可能不是您所期望的

如果您的

favicon.ico

与网页位于同一文件夹中，您只需删除前导斜杠，图标就应该可见

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

更新：

作为一个调试选项，您可以尝试添加一个您知道有效的标记。我从StackOverflow源代码中借用了这段代码。试着用这个替换你的链接标签，看看你是否把SO标志作为你的favicon

<link rel="shortcut icon" 
      href="http://cdn.sstatic.net/stackoverflow/img/favicon.ico">

更新2:

在Chromium上，如果文件是本地加载的，而不是通过Web服务器提供的，则favicon似乎不会显示。

对于初学者来说，您的html是完全错误的，您的头部部分中不应该有div，身体部分之后也不应该有div。我建议您在开始使用favicon等之前先查看正确的html。

Chrome似乎不允许您在地址栏中显示favicon

我也见过这样做。我不知道这是否会产生影响

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

此技巧有效：例如，在页眉或母版页中添加此脚本

    var link = document.createElement('link');
    link.type = 'image/x-icon';
    link.rel = 'shortcut icon';
    link.href = '/favicon.png';

并将被缓存。它不是最优的，但可以工作。

路径必须通过URI（完整）

比如：

因此，在你的情况下：

<!DOCTYPE html>
<html> 
    <head profile="http://www.w3.org/2005/10/profile">
        <title></title>
        <link rel="shortcut icon" 
              type="image/png" 
              href=" http://example.com/favicon.png" />
    </head>
    <body>
    </body>
</html>

参考：

1）清理你的胃痛。并测试另一个浏览器，比如safari。你是怎么进口favicon的

2）您应该如何添加它：

正常粪便：

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

将此页面用于以下内容：

一个常见问题，即如果.htaccess（例如）读取到以下内容，则favicon在预期的情况下不会显示为缓存：

ExpiresByType图像/x图标“访问加1个月”

然后只需向favicon引用添加一个随机值：

Chrome不显示favicon的另一个原因是，它仍然记得有一段时间该站点没有favicon或favicon配置不正确

您需要完全擦除favicon缓存：

退出所有正在运行的Chrome进程

删除用户数据文件夹中的

Favicons

文件。例如：

C:\Users\me\AppData\Local\Google\Chrome\User Data\Default\Favicons

<!DOCTYPE html>
<html> 
    <head>
        <title></title>
        <link rel="profile" href="http://gmpg.org/xfn/11">
        <link rel="icon" href="/favicon.ico" />

这不能通过清除浏览器缓存来解决，因为它不会影响

Favicons

容器

还请注意，与您可能看到的相反，对favicon资源的请求不会显示在DevTools的网络面板中。在非常罕见的情况下，可能会出现一个这样的请求，但这是极不可能的，而且DevTools不会帮助您解决favicon的问题。

我发现（在Chrome 56，OSX上）favicon状态似乎在浏览器的生命周期内被缓存，因此如果没有加载favicon，在重新启动Chrome后，才会启动。它似乎没有出现在开发工具的“应用程序”选项卡中，也没有通过硬重新加载或“清除站点数据”来清除。
这个问题让我发疯了！解决方案其实很简单，只需在标题标记中添加以下内容：

<link rel="profile" href="http://gmpg.org/xfn/11">

例如：

C:\Users\me\AppData\Local\Google\Chrome\User Data\Default\Favicons

<!DOCTYPE html> <html> <head> <title></title> <link rel="profile" href="http://gmpg.org/xfn/11"> <link rel="icon" href="/favicon.ico" />

注意：如果打开的选项卡太多，以至于Google Chrome仅显示图标，那么Google Chrome将不会显示所选选项卡的图标，因此，如果您在加载页面的情况下继续重新加载选项卡以查看新图标，则只会看到页面标题的文本
您需要重新加载页面，然后选择其他选项卡以查看favicon

<link rel="shortcut icon" href="http://cdn.sstatic.net/stackoverflow/img/favicon.ico">

对我来说，问题是上面有一个div（当然不应该在头上，但它发生了）。Firefox不介意，但Chrome介意。
我将ico文件移动到根文件夹并链接它。这对我有用。
此外，在chrome中，我必须等待30分钟才能清除缓存并使新的更改生效
这些是浏览器在Linux中存储临时数据的位置：
注意：您可以使用Ctrl+H在文件管理器中查看隐藏的文件
对于终端，请使用命令ls-la
铬

~/.cache/chromium/[profile]/Cache/
谷歌浏览器

~/.cache/google-chrome/[profile]/Cache/
此外，Chrome和Google Chrome在

~/.config/chromium/[profile]/Application Cache/Cache/
及
一般来说：

/tmp/
因此，使用新的FAVICON或尝试展示它是为了清洁它们
使用以下命令确保u位于每个目录中：

rm -rf *

如果落选的选民评论我的答案为什么是错的，那就太好了。我的头标签上没有一个div。但是你是对的，我对Div也有点陌生。@MikeSmithDev如果他不能编写有效的html，那么他的结果总是不可预测的。这是解决他的问题的第一步，也是最重要的一步。@Nick我的意思是在尸体标签之前。你在头和身体之间有一个div，在身体的末端和html标记的末端也有一个bwteen。@JonTaylor我完全同意你的意见，但是你的建议在评论中更合适。当另一个有同样问题的用户来到这个页面时，你的答案不会有任何帮助。favicon图像的大小是否正确（16倍）