我已经能够设置它，以便在我将站点添加到 iOS 主屏幕时显示正确的图标。它也显示在任何网络浏览器中。但是，当我使用 iOS Safari 时，转到该站点，将其添加到书签列表中，图标会显示一个 C。我希望我们的图标像 www.apple.com 或
www.sunsetwx.com
这是我们的网站:我正在使用的 www.cbcexeter.org:
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png?v=kPgOnJYLYR">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=kPgOnJYLYR">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png?v=kPgOnJYLYR">
<link rel="manifest" href="/manifest.json?v=kPgOnJYLYR">
<link rel="mask-icon" href="/safari-pinned-tab.svg?v=kPgOnJYLYR" color="#bd4c4c">
<link rel="shortcut icon" type="image/png" href="/favicon.png?v=kFginJYoYs">
<meta name="theme-color" content="#ffffff">
我试过 .ico 并没有奏效。
提前致谢。
最佳答案
谢谢你的问题。它让我检查了我自己的网站，我发现你是对的。我最喜欢的图标没有显示在 Safari 中。相反，有一个带有我网站起始字母的默认图标。
快速搜索后，我找到了这个很棒的页面:http://realfavicongenerator.net/
您不仅可以检查现有图标，还可以上传图标并在各种设备/系统上再次测试。然后替换单个图像(例如，我有一个用于 iOS 主屏幕的彩色 png，但有一个用于 safari 书签的单色矢量和另一个用于 android 的单色矢量)。
然后只需生成并下载图标包并将其上传到您的服务器，将生成的代码包含在您页面的 <head> 中，您就可以开始了。
更新
对我来说，它现在似乎正在与您的网站一起使用:
关于html - iOS 书签图标，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43984104/