20

这已经在这里被多次询问，但没有一个可靠且可以理解的答案。这是一个网络应用程序，而不是本机应用程序。

我在用着：

<link rel="apple-touch-startup-image" href="images/startup.png" />

显示启动图像。如果图像的分辨率为 320x460，它可以正常加载。我尝试使用 640x920 的视网膜分辨率（状态栏取出 40 像素），但没有成功。我试过了@2x，也失败了。

甚至有可能[还]？

4

5 回答 5

12

这将为您的 Web 应用程序添加一个启动画面。以下是 iPad 和 iPhone/iPod Touch 所需的尺寸，其中还包括状态栏区域。

    <!-- iPhone -->
    <link href="http://www.example.com/mobile/images/apple-startup-iPhone.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">

    <!-- iPhone (Retina) -->
    <link href="http://www.example.com/mobile/images/apple-startup-iPhone-RETINA.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

    <!-- iPhone 5 -->
    <link href="http://www.example.com/mobile/images/apple-startup-iPhone-Tall-RETINA.jpg"  media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

    <!-- iPad Portrait -->
    <link href="http://www.example.com/mobile/images/apple-startup-iPad-Portrait.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">

    <!-- iPad Landscape -->
    <link href="http://www.example.com/mobile/images/apple-startup-iPad-Landscape.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">

    <!-- iPad Portrait (Retina) -->
    <link href="http://www.example.com/mobile/images/apple-startup-iPad-RETINA-Portrait.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

    <!-- iPad Landscape (Retina) -->
    <link href="http://www.example.com/mobile/images/apple-startup-iPad-RETINA-Landscape.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

如果创建与 iPad 兼容的 Web 应用程序，建议同时使用横向和纵向尺寸。

于 2012-03-04T04:08:10.510 回答
6

文档（在此处找到）说：

在 iPhone 和 iPod touch 上，图像必须是 320 x 460 像素并且是纵向的。

我已经测试过提供不同的尺寸，但如果尺寸不完全是 320x460，图像就会被忽略。苹果没有明确声明是否可以包含高分辨率启动图像，但论坛帖子（例如此处：Apple Dev Forum）表明目前不可能。

于 2010-10-04T12:35:06.807 回答
5

刚刚做了测试......苹果已经添加了“尺寸”属性。因此，对于高分辨率，您添加 size="640x920" 等。我想这也适用于不同的方向。

于 2011-03-10T22:34:46.033 回答
0

因此，如果我理解得很好，考虑到我们需要考虑3 个参数，我们实际上需要8个不同的图像：

  • 设备（iPhone 或 iPad）
  • 分辨率（视网膜与否）
  • 方向（纵向或横向）

我对吗？

于 2012-09-28T00:06:58.177 回答
0

这对我有用：

<link rel="apple-touch-startup-image" media="screen and (max-device-width: 320px)" href="images/iphone_splash.png"/>
<link rel="apple-touch-startup-image" media="(max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)" href="images/iphone_splash_hires.png" />
于 2012-07-24T18:16:50.297 回答