9 dispositivos · Smartphones
Las características de visualización de los 9 dispositivos Huawei referenciados, con para cada uno el ancho sobre el cual resuenan tus media queries, su densidad de píxel y la resolución de su pantalla. 1 de estos dispositivos se prueban directamente en tu navegador.
2 anchos CSS distintos cubren toda la gama: 360 y 392 px. Varios modelos comparten el mismo: validar uno de ellos es suficiente para validar los demás.
| Modelo | Viewport CSS | Densidad | Resolución de pantalla | Diagonal | Año |
|---|---|---|---|---|---|
| Huawei Nova 7i | 360 × 770 | 3x | 1080 × 2310 | 6,4" | 2020 |
| Huawei Mate 30 | 360 × 780 | 3x | 1080 × 2340 | 6,6" | 2019 |
| Huawei Mate 30 Pro | 392 × 800 | 3x | 1176 × 2400 | 6,5" | 2019 |
| Huawei P30 PRO | 360 × 780 | 3x | 1080 × 2340 | 6,5" | 2019 |
| Huawei Y9 Prime | 360 × 780 | 3x | 1080 × 2340 | 6,6" | 2019 |
| Huawei Y9s | 360 × 780 | 3x | 1080 × 2340 | 6,6" | 2019 |
| Huawei Mate 20 Lite | 360 × 780 | 3x | 1080 × 2340 | 6,3" | 2018 |
| Huawei Mate 20 Pro | 360 × 780 | 4x | 1440 × 3120 | 6,4" | 2018 |
| Huawei Mate 10 Lite | 360 × 720 | 3x | 1080 × 2160 | 5,9" | 2017 |
Los anchos más representados de la gama son 360 y 392 px. Verificarlos primero cubre 9 de los 9 modelos Huawei referenciados, y es sobre ellos que deben caer tus primeros puntos de ruptura.
Descienda hasta 360 px para cubrir toda la gama, incluido Huawei Nova 7i: un diseño que se ajusta a este ancho se ajusta en todas partes, incluidos los modelos más antiguos aún en circulación.
Atención a la altura: los navegadores móviles reducen el área visible con sus barras de interfaz, y estas se retraen al desplazarse. Una altura en 100vh desborda por lo tanto de la primera pantalla; las unidades svh y dvh son preferibles.
Las tablas dan las medidas. La extensión muestra tu sitio en el viewport exacto del modelo, con su densidad, su User-Agent y el cambio de retrato a paisaje.
Gratis · 4,9/5 sobre 5100 opiniones
1.500.000+ usuarios
360 x 770 px, compartido por 8 de los 9 modelos referenciados, incluyendo Huawei Nova 7i y Huawei Mate 30. Es el ancho a verificar primero en esta gama.
360 px, el ancho del modelo más estrecho de la lista, Huawei Nova 7i. Si su diseño se ajusta a 360 px, se ajusta a los 9 dispositivos Huawei referenciados, hasta el más ancho que alcanza 392 px.
Porque estas pantallas muestran varios píxeles físicos por píxel CSS. Huawei Nova 7i tiene una pantalla de 1080 x 2310 píxeles y un viewport CSS de 360 x 770 px, es decir, una densidad de 3. Es el segundo valor que se debe escribir en una media query.
Con la extensión Mobile FIRST: reproduce el viewport, la densidad de píxel, el User-Agent y los eventos táctiles de 1 de estos modelos, directamente en su navegador, incluso en una dirección en localhost.
Las marcas y modelos mencionados pertenecen a sus respectivos propietarios.