¿Qué son las Media Queries?
Las Media Queries permiten aplicar reglas CSS condicionalmente según las características del dispositivo: ancho, alto, orientación, resolución, etc.
Son la base del diseño responsivo (Responsive Web Design).
Demostración
Redimensiona la ventana del navegador o rota el dispositivo para observar cómo cambia el color de fondo según cada regla @media.
- Ancho ≥ 360px → fondo rojo
- Ancho ≥ 500px → fondo azul
- Orientación horizontal → fondo verde