html - Apple touch 图标未显示在主屏幕上

Question

我正在使用以下代码获取移动设备的触摸图标 - 它基于 html5boilerplate/mobile 示例:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">

<!-- For iPhone 4 with high-resolution Retina display: -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="/img/touch/h/apple-touch-icon.png">
<!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
<link rel="apple-touch-icon-precomposed" href="/img/touch/l/apple-touch-icon.png">
<!-- For nokia devices: -->
<link rel="shortcut icon" href="/img/touch/apple-touch-icon.png">

<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">

但出于某种原因，iPhone 的主屏幕图标仍然出现问题。我得到的只是那个烦人的屏幕截图图标。

我在此处包括了其他元标记，以防它们阐明它为何不起作用。我试过重新排序标签。

谁能想到什么可以阻止图标被使用？

我使用 html5boilerplate/mobile 作为测试用例 - 我能够浏览到他们的网站并将图标添加到我的 iPhone (4S iOS5) 的主屏幕上。我试过将他们的代码、文件夹结构和图标复制到我自己的站点中，但这没有用。

有什么想法吗？

Answer 1

我遇到了同样的问题。解决方案是取消网站上的密码保护。