IPhone 6

• Paisaje

  @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)
  { }
  

• Retrato

  @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)
  { }
  

  si lo prefiere, puede usar (device-width : 375px) y (device-height: 559px) en lugar de los ajustes min- y max-.

  No es necesario utilizar todos estos ajustes, y estos no son todos los ajustes posibles. Estas son solo la mayoría de las opciones posibles para que pueda elegir las que satisfagan sus necesidades.

• Usuario Agente

  probado con mi iPhone 6 (modelo MG6G2LL / A) con iOS 9.0 (13A4305g)

  # Safari
  Mozilla/5.0 (iPhone; CPU iPhone OS 9_0 like Mac OS X) AppleWebKit/601.1.39 (KHTML, like Gecko) Version/9.0 Mobile/13A4305g Safari 601.1
  # Google Chrome
  Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_3) AppleWebKit/534.53.11 (KHTML, like Gecko) Version/5.1.3 Safari/534.53.10 (000102)
  # Mercury
  Mozilla/5.0 (iPhone; CPU iPhone OS 7_0_4 like Mac OS X) AppleWebKit/537.51.1 (KHTML, like Gecko) Version/7.0 Mobile/11B554a Safari/9537.53
  

• Imágenes de lanzamiento

  • 750 x 1334 (@2x) para retrato
  • 1334 x 750 (@2x) para paisaje

• Icono de la aplicación

  • 120 x 120

IPhone 6+

• Paisaje

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

• Retrato

  @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)
  { }
  

• Lanzamiento imágenes

  • 1242 x 2208 (@3x) para retrato
  • 2208 x 1242 (@3x) para paisaje

• Icono de la aplicación

  • 180 x 180

IPhone 6 y 6+

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

Predicho

De acuerdo con el sitio web de Apple el iPhone 6 Plus tendrá 401 píxeles por pulgada y será 1920 x 1080. La versión más pequeña del iPhone 6 será 1334 x 750 con 326 PPI.

Entonces, suponiendo que la información es correcta, podemos escribir una consulta de medios para el iPhone 6:

@media screen 
    and (min-device-width : 1080px) 
    and (max-device-width : 1920px) 
    and (min-resolution: 401dpi) 
    and (device-aspect-ratio:16/9) 
{ }

@media screen 
    and (min-device-width : 750px) 
    and (max-device-width : 1334px) 
    and (min-resolution: 326dpi) 
{ }

Tenga en cuenta que relación dispositivo-aspecto será obsoleta en http://dev.w3.org/csswg/mediaqueries-4 / y sustituido por relación de aspecto

El ancho mínimo y el ancho máximo pueden ser algo así como 1704 x 960.

Apple Watch (especulativo)

Las especificaciones del Reloj siguen siendo un poco especulativas ya que (por lo que sé) no ha habido una hoja de especificaciones oficial aun. Pero Apple mencionó en este comunicado de prensa que el reloj estará disponible en dos tamaños.. 38 mm y 42 mm

Suponiendo además.. que esos tamaños se refieran al tamaño de la pantalla en lugar del tamaño total de la esfera del reloj, estas consultas de medios deberían funcionar.. Y estoy seguro de que podría dar o tomar unos pocos milímetros para cubrir cualquier escenario sin sacrificar ningún objetivo no deseado porque..

@media (!small) and (damn-small), (omfg) { }

O

@media 
    (max-device-width:42mm) 
    and (min-device-width:38mm) 
{ }

Vale la pena señalar que Medios Consultas Nivel 4 de W3C actualmente solo está disponible como un primer borrador público, una vez disponible para su uso traerá consigo una gran cantidad de nuevas características diseñadas con dispositivos portátiles más pequeños como este en mente.