Html 图标不显示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7324456/
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
Favicon not showing up
提问by TheGateKeeper
I placed my favicon here:
我把我的收藏夹放在这里：
http://www.vittoriosastarsnursery.com/favicon.ico
http://www.vittoriosastarsnursery.com/favicon.ico
But for some reason it doesn't want to show in Firefox. It did work in IE, but I'm more concerned about getting it working in Firefox.
但出于某种原因，它不想在 Firefox 中显示。它确实在 IE 中工作，但我更关心让它在 Firefox 中工作。
采纳答案by Jamie
I can see it in Chrome, Firefox, and IE. My friend had a problem like this when we were testing back in college. It was just a weird caching thing that made her think it wasn't working right. I'm sure that everyone besides you will be able to see that it works fine. You could always try restarting your browser after clearing the cache and see if that helps.
我可以在 Chrome、Firefox 和 IE 中看到它。我的朋友在大学考试时遇到了这样的问题。这只是一个奇怪的缓存事情，让她认为它没有正常工作。我相信除了你之外的每个人都能看到它运行良好。您可以随时尝试在清除缓存后重新启动浏览器，看看是否有帮助。
回答by FeroxTL
Suddenly I found answer here
突然我在这里找到了答案
You should add "?" to your favicon path and it works! Even with path such as images/favicon.ico. Just try:
你应该加上“？” 到您的图标路径，它的工作原理！即使使用诸如images/favicon.ico. 你试一试：
<link rel="icon" href="/images/favicon.ico?" type="image/x-icon">
<link rel="icon" href="/images/favicon.ico?" type="image/x-icon">
Other browsers works too.
其他浏览器也可以。
Remember to restart mozilla, because of it's own cache, that is not connected with css and other caching.
记得重启mozilla，因为它有自己的缓存，没有连接css等缓存。
updated:
更新：
Another way is set redirect from favicon.icoto /images/favicon.ico(301 works)
另一种方式是设置redirect from favicon.icoto /images/favicon.ico(301 works)
回答by GuyFromOverThere
<link rel="icon" href="http://khachmeruk.com/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="http://khachmeruk.com/favicon.ico" type="image/x-icon">
回答by DrewT
Two things to consider
需要考虑的两件事
- If it's working in some browsers and not in others it's likely going to be a cache issue. Clear your cache and refresh, or for more in depth info: How do I force a favicon refresh
- If favicon.ico is in the project's root folder but not being recognized by any browsers I would check out the .htaccess, or whatever equivalent of .htaccess depending on server type etc.
- 如果它在某些浏览器中有效，而在其他浏览器中无效，则可能是缓存问题。清除缓存并刷新，或了解更深入的信息：How do I force a favicon refresh
- 如果 favicon.ico 位于项目的根文件夹中但未被任何浏览器识别，我会检查 .htaccess 或任何等效的 .htaccess 取决于服务器类型等。
回答by Erdem Zengin
For those who suffer from this problem, try move your favicon file to home directory. It worked for me and solved my problem.
对于那些遇到此问题的人，请尝试将您的图标文件移动到主目录。它对我有用并解决了我的问题。
回答by AllJs
If you don't want to spend hours. trying to figure out why your favicon is not showing up, make sure to always place it in the root of your project folder and add a link in the <head></head>section of your page like so:
如果你不想花几个小时。试图找出为什么您的网站图标没有显示出来，请确保始终将其放在项目文件夹的根目录中，并在<head></head>您的页面部分添加一个链接，如下所示：
<head>
//other code
<link rel="icon" href="favicon.ico" type="image/x-icon">
//other code
</head>
Folder Structure
文件夹结构
--app
-----img
-----js
-----css
-----favicon.ico
回答by Dylan Tack
It works for me in FireFox. When running identify(part of the ImageMagick package), it reports this problem:
identify: invalid colormap index 'favicon.ico' @ error/image.c/SyncImage/3906
它在 FireFox 中对我有用。运行时identify（ImageMagick包的一部分），报这个问题：
identify: invalid colormap index 'favicon.ico' @ error/image.c/SyncImage/3906
Perhaps opening the file in a graphics editor and re-saving it would clean up this error.
也许在图形编辑器中打开文件并重新保存它会清除此错误。
回答by Daymon
I had this problem too. it turns out (for me at least) that blocking users / agents with no referrer via .htaccess caused the problem.
我也有这个问题。事实证明（至少对我而言）是通过 .htaccess 阻止没有引荐来源的用户/代理导致了问题。
回答by Jeremy
It is just a caching issue. Just change the file name and it will show up immediately... otherwise do nothing and it will show up eventually. Browsers are just very persistent with the favicon caching.
这只是一个缓存问题。只需更改文件名，它就会立即显示出来……否则什么都不做，它最终会显示出来。浏览器对图标缓存非常执着。
回答by Abhishek Raj
https://github.com/ritwickdey/vscode-live-server/issues/77
https://github.com/ritwickdey/vscode-live-server/issues/77
I was facing this problem with VS-Code live server, as discussed above it's browser cache issue, there is popular github thread on this.
我在使用 VS-Code 实时服务器时遇到了这个问题，如上所述，这是浏览器缓存问题，对此有流行的 github 线程。
just try the trick:
试试这个技巧：
<link rel="icon" href="favicon.ico?v=2" type="image/x-icon"/>Happy learning
快乐学习
