Consultas de mídia para atingir diferentes densidades de pixel
/* CSS for Retina & XHDPI Android screens (these should get retina assets) */
@media screen and (-webkit-device-pixel-ratio: 2) {
}
/* CSS for HDPI Android screens */
@media screen and (-webkit-device-pixel-ratio: 1.5) {
}
/* CSS for MDPI screens (this is generally default so unlikely you'll use this often) */
@media screen and (-webkit-device-pixel-ratio: 1) {
}
/* CSS for LDPI screens */
@media screen and (-webkit-device-pixel-ratio: 0.75) {
}
Para direcionar densidades de tela específicas em JavaScript
if (window.devicePixelRatio == 1.5) {
console.log("This is a high-density screen");
} else if (window.devicePixelRatio == 0.75) {
console.log("This is a low-density screen");
}