Correct Size for apple-touch-startup-image in iPhone 6, iPhone 6 Plus?

后端 未结 2 1447
走了就别回头了
走了就别回头了 2021-01-19 08:22

Wanting to see if my math and media queries are correct here, as I cannot find this info anywhere.




        
相关标签:
2条回答
  • 2021-01-19 09:13

    I don't have enough reputation to comment, so here is my proposed answer, based on the excellent answer by Adam Smith:

    <!-- iPhone 6 -->
    <link href="750x1294.png" media="(device-width: 375px) and (device-height: 667px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
    
    <!-- iPhone 6+ Portrait -->
    <link href="1242x2148.png" media="(device-width: 414px) and (device-height: 736px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image">
    
    <!-- iPhone 6+ Landscape -->
    <link href="1182x2208r.png" media="(device-width: 414px) and (device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image">
    

    Note the 6+ landscape image must be rotated to the right by 90° and must be sized 1182x2208. This is consistent with the landscape startup images for the iPad. If you are a webapp developer and have an iPhone 6+ please test this answer and comment. Thanks!

    0 讨论(0)
  • 2021-01-19 09:19

    Edit: I have removed incorrect information from my post, what you had placed is correct minus the iPhone 6 landscape mode, and swap the width/height for iPhone 6+ landscape.

    <!-- iPhone 6 -->
    <link href="750x1294.png" media="(device-width: 375px) and (device-height: 667px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">
    
    <!-- iPhone 6+ Portrait -->
    <link href="1242x2148.png" media="(device-width: 414px) and (device-height: 736px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image">
    
    <!-- iPhone 6+ Landscape -->
    <link href="2208x1182.png" media="(device-width: 414px) and (device-height: 736px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image">
    

    I had previously made a mistake by using startup image sizes the same as the device, and they simply don't show, the correct image sizes must be used.

    0 讨论(0)
提交回复
热议问题