如何為 iPhone 6 和 6 Plus 編寫特定於尺寸的媒體查詢？

iPhone 6 和 6 Plus 的特定尺寸媒體查詢

iPhone 6

• 風景：

  @media only screen 
      and (min-device-width : 375px) // or 213.4375em or 3in or 9cm
      and (max-device-width : 667px) // or 41.6875em
      and (width : 667px) // or 41.6875em
      and (height : 375px) // or 23.4375em
      and (orientation : landscape) 
      and (color : 8)
      and (device-aspect-ratio : 375/667)
      and (aspect-ratio : 667/375)
      and (device-pixel-ratio : 2)
      and (-webkit-min-device-pixel-ratio : 2)
  { }

• 肖像：

  @media only screen 
      and (min-device-width : 375px) // or 213.4375em
      and (max-device-width : 667px) // or 41.6875em
      and (width : 375px) // or 23.4375em
      and (height : 559px) // or 34.9375em
      and (orientation : portrait) 
      and (color : 8)
      and (device-aspect-ratio : 375/667)
      and (aspect-ratio : 375/559)
      and (device-pixel-ratio : 2)
      and (-webkit-min-device-pixel-ratio : 2)
  { }

iPhone 6加

• 風景：

  @media only screen 
      and (min-device-width : 414px) 
      and (max-device-width : 736px) 
      and (orientation : landscape) 
      and (-webkit-min-device-pixel-ratio : 3) 
  { }

• 肖像：

  @media only screen 
      and (min-device-width : 414px) 
      and (max-device-width : 736px)
      and (device-width : 414px)
      and (device-height : 736px)
      and (orientation : portrait)
      and (-webkit-min-device-pixel-ratio : 3) 
      and (-webkit-device-pixel-ratio : 3)
  { }

啟動影像與圖示

iPhone 6

• 啟動影像：

  • 啟動影像：
啟動圖片750 x 1334 (@2x )
• 風景： 1334 x 750 (@2x)

應用程式圖示：120 x 120

• iPhone 🎜>iPhone 🎜>
  • 啟動圖片：
  縱向：1242 x 2208 (@3x)
• 橫向：2208 x 1242 (@3x)

• @media only screen 
      and (max-device-width: 640px), 
      only screen and (max-device-width: 667px), 
      only screen and (max-width: 480px)
  { }

  應用程式圖示： 180× 180

一般兩者：兩者：兩者：

以上是如何為 iPhone 6 和 6 Plus 編寫特定於尺寸的媒體查詢？的詳細內容。更多資訊請關注PHP中文網其他相關文章！