favicon.svg 未显示在标题栏中
[英]favicon.svg not showing in title bar
问题描述
I have worked on this for days trying to solve the problem.
为了解决这个问题，我已经为此工作了好几天。 I can't get the favicon.svg to show up on my browser (using latest Chrome).我无法让 favicon.svg 显示在我的浏览器上（使用最新的 Chrome）。
The source file is源文件是
<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 48 48"><path stroke="black" stroke-linecap="round" d="M6,6 L21,21 M6,21 L21,6"/></svg>
The icon shows fine in the main screen if I navigate to http://MYSITEHERE/favicon.svg如果我导航到 http://MYSITEHERE/favicon.svg，该图标在主屏幕上显示正常
BUT it does not show up when I navigate to http://MYSITEHERE但是当我导航到 http://MYSITEHERE 时它没有出现
The website is working otherwise and starts with:该网站以其他方式工作，并以以下内容开头：
<!DOCTYPE html><html><head>
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0,minimum-scale=1">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta charset="UTF-8">
<title>Administrator Login - CLO Web Design</title>
<link rel="icon" href="/favicon.svg" sizes="any">
<link href='https://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet'>
<style>....
Any ideas?有任何想法吗？ I have scoured the web trying to find answers.我已经搜索了 web 试图找到答案。 Most places say to include the大多数地方都说要包括
<link rel="icon" href="/favicon.svg" sizes="any">
and it will be fine (which I have).会好的（我有）。 Its also 48x48 which should be accepted by Google.它也是 48x48 应该被谷歌接受。 Why not?为什么不？
Many thanks.非常感谢。
[Update 28/12/2022 based on Sebastian Simon's help - see below] [根据 Sebastian Simon 的帮助更新 28/12/2022 - 见下文]
2 个解决方案
解决方案1
0 2022-12-27 01:31:22
You should add the type also: type="image/svg+xml" and make sure that the path is correct.您还应该添加类型： type="image/svg+xml"并确保路径正确。 Check the browser console for any loading errors that might suggest you are using the wrong relative path.检查浏览器控制台是否有任何可能表明您使用了错误的相对路径的加载错误。
<link rel="icon" href="favicon.svg" sizes="any" type="image/svg+xml" />
解决方案2
0 2022-12-27 23:03:19
Ok, I have found a "work around":好的，我找到了一个“解决方法”：
<link rel="icon" href="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 64 64'><path stroke='black' stroke-linecap='round' d='M6,6 L21,21 M6,21 L21,6'/></svg>" sizes="any" type="image/svg+xml" />
This doesn't exactly explain why the favicon was not showing earlier, but at least it solves the problem and actually is probably more efficient preventing the additional favicon request...这并不能完全解释为什么 favicon 没有更早显示的原因，但至少它解决了问题并且实际上可能更有效地防止额外的 favicon 请求......
(PS. ignore the icon data which is just an "x" - I intend to change that.) （PS。忽略只是一个“x”的图标数据 - 我打算改变它。）
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.