Html 为什么我的网站图标不显示?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15447102/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why does my favicon not show up?
提问by Sivajith
The following is used to set the favicon in my html code:
以下用于在我的 html 代码中设置 favicon:
<link rel="icon" type="img/ico" href="img/favicon.ico">
However, the icon does not show. Why?
但是,该图标不显示。为什么?
Note:
笔记:
I have confirmed that the file is on-disk at the correct path.
我已确认该文件位于正确路径的磁盘上。
回答by Rich Bradshaw
- Is it really a
.ico
, or is it just named ".ico"? - What browser are you testing in?
- 它真的是一个
.ico
,还是只是命名为“.ico”? - 你在什么浏览器上测试?
The absolutely easiest way to have a favicon is to place an icon called "favicon.ico" in the root folder. That just works everywhere, no code needed at all.
拥有 favicon 的最简单方法是在根文件夹中放置一个名为“favicon.ico”的图标。这在任何地方都有效,根本不需要代码。
If you must have it in a subdirectory, use:
如果您必须将它放在子目录中,请使用:
<link rel="shortcut icon" href="/img/favicon.ico" />
Note the /
before img
to ensure it is anchored to the root folder.
注意/
beforeimg
以确保它锚定到根文件夹。
回答by Cris
Try this:
尝试这个:
<link href="img/favicon.ico" rel="shortcut icon" type="image/x-icon" />
回答by timthelion
Favicons only work when served from a web-server which sets mime-types correctly for served content. Loading from a local file might not work in chromium. Loading from an incorrectly configured web-server will not work.
Favicon 仅在从 Web 服务器提供时才有效,该服务器为提供的内容正确设置了 MIME 类型。从本地文件加载可能无法在 Chrome 中工作。从配置不正确的 Web 服务器加载将不起作用。
Web-servers such as lighthttpd must be configured manuallyto set the mime type correctly.
必须手动配置诸如 lighthttpd 之类的 Web 服务器才能正确设置 MIME 类型。
Because of the likelihood that mimetype assignment will not work in all environments, I would suggest you use an inline base64 encodedico file instead. This will load faster as well, as it reduces the number of http requests sent to the server.
由于 mimetype 分配可能不适用于所有环境,我建议您改用内联base64 编码的ico 文件。这也会更快地加载,因为它减少了发送到服务器的 http 请求的数量。
On POSIX based systems you can base64 encode a file with the base64
command.
在基于 POSIX 的系统上,您可以使用该base64
命令对文件进行 base64 编码。
To create a base64 encoded ico line use the command:
要创建 base64 编码的 ico 行,请使用以下命令:
$ base64 favicon.ico --wrap 0
And insert the output into the line:
并将输出插入到行中:
<link href="data:image/x-icon;base64,HERE" rel="icon" type="image/x-icon" />
Replacing the word HERE
like so:
HERE
像这样替换单词:
<link href="data:image/x-icon;base64,AAABAAEAEBAQAAEABAAoAQAAFgAAACgAAAAQAAAAIAAAAAEABAAAAAAAgAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAA////AERpOgA5cCcA7vDtAF6jSABllFcAuuCvAK2trQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFjMzMzMzNxARYzMzMzVBEEERYzMzNhERZxRGMzZxQEA2FER3cRSAgTNxgEEREIQBMzFIARERFEEzNhERARFAATMzYREBEAhBMzMzEYEBFEEzMzNhEQQRQDMzMzcRgEAAMzMzNhERgIEzMzMyERgEQDMzMzMRAEgEMzMzMxERAEEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA" rel="icon" type="image/x-icon" />
回答by Iswanto San
Try adding the profile
attribute to your head
tag and use "image/x-icon"
for the type
attribute:
尝试将profile
属性添加到您的head
标签并"image/x-icon"
用于该type
属性:
<head profile="http://www.w3.org/2005/10/profile">
<link rel="icon" type="image/x-icon" href="img/favicon.ico">
If the above code doesn't work, try using the full icon path for the href
attribute:
如果上述代码不起作用,请尝试使用该href
属性的完整图标路径:
<head profile="http://www.w3.org/2005/10/profile">
<link rel="icon" type="image/x-icon" href="http://example.com/img/favicon.ico">