0

我有一个带有移动版本的网站，我正在尝试获取它，以便当有人选择为网站添加书签或“添加到主屏幕”时，它会将图标保存到主屏幕。我有一个 Android 三星 Galaxy S3，无论我尝试什么，我都无法让它使用图标而不是标准功能区，中间有微小的预览。

目前..以下代码将使其显示标准功能区，并带有图标图像的微小预览，但不会显示整个图标：

<link rel="icon" href="http://www.mydomain.com/favicon.ico" type="image/x-icon"/>
<link rel="shortcut icon" href="http://www.mydomain.com/favicon.ico" type="image/x-icon"/>

我也尝试过这段代码，当我将书签添加到我的主屏幕时，它只会产生标准的功能区图标。甚至没有像上面这样的小预览：

<link rel="apple-touch-icon" href="http://www.mydomain.com/customicon.ico"/>
<link rel="apple-touch-icon-precomposed" href="http://www.mydomain.com/customicon.ico"/>

注意：我也尝试过 1）将图标文件放在根目录中。2) 将文件名命名为 apple-touch-icon-precomposed.ico。3) 图标为 57x57 且小于 40 kb。

我知道有一些方法可以实现这一点，因为我测试了几个网站，比如 AOL 和 eBay，它们都保存到我的主屏幕上，并带有一个看起来像应用程序的正常大小的图标。

如果有人遇到同样的问题并找到可行的解决方案，请告诉我。我难住了！

4

1 回答 1

0

整个问题是因为该网站在设计和开发期间出于测试目的而受到 .htaccess 密码保护。我所要做的就是将包含所有图标的文件夹移到受密码保护的目录之外！

以下代码是我使用的，现在正在工作：

<link rel="apple-touch-icon" sizes="144x144" href="http://m.mydomain.com/touch-icon-ipad-retina.png" />
<link rel="apple-touch-icon" sizes="114x114" href="http://m.mydomain.com/touch-icon-iphone-retina.png" />
<link rel="apple-touch-icon" sizes="72x72" href="http://m.mydomain.com/touch-icon-ipad.png" />
<link rel="apple-touch-icon" href="http://m.mydomain.com/touch-icon-iphone.png" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
于 2013-05-16T21:02:39.163 回答