7

当您选择“添加到主屏幕”时，我不太熟悉为 iOS（和 Android）添加图标的代码，但根据我阅读的内容，我使用了以下代码：

    <link rel="apple-touch-icon-precomposed" href="http://www.redtypewriter.com/wp-content/uploads/2014/03/57.jpg"/>  
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="http://www.redtypewriter.com/wp-content/uploads/2014/03/72.jpg"/>  
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="http://www.redtypewriter.com/wp-content/uploads/2014/03/114.jpg"/>

该代码似乎有效，但是在我将其添加到主屏幕后，一段时间后，图标消失了，我留下一个黑色方块代替图标？发生了什么？该网站是：http ://www.redtypewriter.com/如果你想看看，我正在使用自定义 WordPress 主题。

谢谢！

4

1 回答 1

9

获得黑色图标有两个主要原因：

  • 使用 JPG 图片（iOS 更喜欢 PNG）
  • 使用带有透明区域的 PNG。iOS 用黑色填充透明区域。

在您的情况下，这是因为您的图片是 JPG 格式而不是 PNG。

有了你的原始图片，我观察到三个问题：

  • 正如您所描述的那样，黑色图标。
  • 我的设备需要一些时间才能显示图标（例如，添加到主屏幕时）。在最初的几秒钟内，我只看到了默认图标。这并不奇怪，但我有点惊讶。
  • 书签时，我的设备没有使用您的图标，而是使用另一个：

一旦我将它们转换为 PNG 并相应地更改 HTML 代码，所有问题都立即得到解决。

此外，您没有定义足够的图片。例如，您的图标在 Retina iPad 上看起来不太好。

于 2014-04-12T07:08:30.580 回答