Resolución del viewport (reglas CSS)
Es la resolución que más interesa a los diseñadores y desarrolladores porque condiciona los breakpoints y la definición de las media queries. En general, solo se habla de esta resolución.
En cuanto a Apple MacBook Air 2020 13", es de:
- 1280 píxeles en ancho (width)
- 800 píxeles en altura (height) ⚠️ la altura es indicativa porque el navegador Safari, Chrome, etc., reduce el área visible
ℹ️ Algunas herramientas de análisis solo muestran la resolución del fabricante (a continuación) y no la presentada arriba, así que tenga cuidado al interpretar los resultados.
Disponible en el simulador
Pruebe su sitio responsive en Apple MacBook Air 2020 13" gracias a la extensión del navegador.
Es gratis y activable en 2 clics.
Densidad de píxel
En Apple MacBook Air 2020 13" es de 2
Si desea dirigirse en CSS a los dispositivos con al menos esta densidad de píxel, puede usar esta media query.
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
/* CSS */
}
También en javascript, es posible recuperar el valor de la densidad de píxel.
window.devicePixelRatio
// Lo que devolverá el número 2
Resolución del fabricante Apple MacBook Air 2020 13"
Dada la densidad de píxel, esto da:
- 2560 píxeles de ancho
- 1600 píxeles de alto
Mockup HD gratuito en formato PNG
