IPAD 是否有等效的 apple-touch-startup-image ？

Question

对于网络应用，您可以使用 apple-touch-startup-image 设置启动屏幕

iPad 呢？

Answer 1

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

<!-- iPhone -->
<link href="http://www.example.com/mobile/images/apple-touch-startup-image-320x460.png"
      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-touch-startup-image-640x920.png"
      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-touch-startup-image-640x1096.png"
      media="(device-width: 320px) and (device-height: 568px)
         and (-webkit-device-pixel-ratio: 2)"
      rel="apple-touch-startup-image">

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

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

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

Answer 2

人像图片需要为 768x1004（注意：1004，不是 1024，20px 用于状态栏），PNG 是首选文件格式。

横向图片需要为 1024x748（注意：748，状态栏也是 20px）。然后需要将该图像顺时针旋转 90 度，最终结果为 748x1024。

header中的链接标签需要如下：

<link rel="apple-touch-startup-image" href="images/splash_screen_768x1004.png" media="(device-width: 768px) and (orientation: portrait)" />
<link rel="apple-touch-startup-image" href="images/splash_screen_1024x748.png" media="(device-width: 768px) and (orientation: landscape)" />

对于新的 Retina iPad（如果你不添加这些，它将使用上面的像素加倍）：

<link rel="apple-touch-startup-image"
  href="images/splash_screen_1536x2008.png" 
  media="(device-width: 1536px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" />
<link rel="apple-touch-startup-image"
  href="images/splash_screen_2048x1496.png"
  media="(device-width: 1536px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" />

---

发布此问题时的先前答案（包括已接受的答案）不适用于我的测试。

Answer 3

我能找到的关于这个问题的最佳解释：https://gist.github.com/472519

请注意，只有在我为 iPhone 提供启动图像并为 iPad 提供横向/纵向图像时，它才对我有效。

Answer 4

我只是通过制作尺寸为 748x1024 的 PNG 图像来使启动图像工作。这是在固件 3.2.1 的 iPad 上测试的。

Answer 5

我也遇到了同样的问题...您需要使用 1004*768 的特定尺寸。我在这个博客中解释过：http://www.amirnaor.com/?p=71

Answer 6

我认为 Madhup 指的是用 Objective C 编写并使用 xcode 编译的本机应用程序。 OP 正试图使其适用于通过 safari 添加到主屏幕的 web 应用程序。 到目前为止还没有让它工作:(

Answer 7

从我今天的测试来看，iPad 似乎不支持 apple-touch-startup-image。令人失望的是，iPhone 确实在 OS 3.1 中支持此功能，而 iPad 不支持。此外，在无铬浏览器中使用 web 应用程序时，视口设置不正确。 我相信两者都是 iPad OS 3.2 中的错误或遗漏。太糟糕了 ：（ 我确实在苹果论坛上要求过：https://devforums.apple.com/thread/47178

Answer 8

和iphone一样。在资源文件夹中放置一个名为Default.png 的png。