El viewport del iPhone 17 Pro Max que usa Mobile Preview es de 440 × 956 píxeles CSS en vertical y 956 × 440 en horizontal. La cámara es: Dynamic Island.
El tamaño de un vistazo
| Vertical | 440 × 956 px |
|---|---|
| Horizontal | 956 × 440 px |
| Proporción alto / ancho | 2.17 |
| Cámara | Dynamic Island |
| Tailwind (vertical) | por debajo de sm (menos de 640 px) |
| Tailwind (horizontal) | md (desde 768 px) |
Son píxeles CSS (de maquetación), los tamaños del marco de Mobile Preview. En un dispositivo real pueden variar un poco según la interfaz del navegador, el zoom de pantalla o la versión del sistema.
Pruébalo en CSS
Es mejor usar breakpoints basados en tu contenido que reglas por dispositivo. Si necesitas reproducir este tamaño exacto, por ejemplo para depurar un diseño, esta media query lo selecciona en vertical:
@media (width: 440px) and (height: 956px) {
/* iPhone 17 Pro Max, vertical */
}El recorte (Dynamic Island) invade la parte superior de la pantalla en diseños a pantalla completa. Añade viewport-fit=cover a tu meta viewport y aplica padding con env(safe-area-inset-top) a las cabeceras fijas para que nada quede detrás.
Dispositivos con el mismo viewport que el iPhone 17 Pro Max
Estos marcos usan el mismo viewport de 440 × 956, así que una sola comprobación los cubre todos:
Previsualizar el iPhone 17 Pro Max en VS Code
El marco iPhone 17 Pro Max está incluido en la versión gratuita de Mobile Preview. Instala la extensión, arranca tu servidor de desarrollo, ejecuta «Mobile Preview: Show» y elige iPhone 17 Pro Max en el menú de dispositivos: tu página aparece en el marco junto a tu código y se recarga al guardar.
Anchos similares
- iPhone 15 Pro Max (430 × 932)
- iPhone Air (420 × 912)
- Samsung Galaxy S25 Ultra (420 × 915)
Preguntas frecuentes
- ¿Cuál es el tamaño del viewport del iPhone 17 Pro Max en píxeles CSS?
- 440 × 956 en vertical (ancho × alto) y 956 × 440 en horizontal, según usa Mobile Preview. La pantalla física tiene más píxeles; los píxeles CSS son lo que ve tu diseño.
- ¿En qué breakpoint de Tailwind está el iPhone 17 Pro Max?
- Con los breakpoints por defecto de Tailwind, el iPhone 17 Pro Max está por debajo de sm (menos de 640 px) en vertical y md (desde 768 px) en horizontal.
- ¿Puedo previsualizar mi sitio en el iPhone 17 Pro Max dentro de VS Code?
- Sí. El marco iPhone 17 Pro Max está incluido en la versión gratuita de Mobile Preview.
Todos los tamaños de dispositivos · EN · FR · PT · DE