max-width es el ancho del área de visualización de destino, por ejemplo, el navegador; max-device-width es el ancho del área de representación completa del dispositivo, es decir, la pantalla real del dispositivo.
• Si está utilizando el ancho máximo del dispositivo , cuando cambia el tamaño de la ventana del navegador en su escritorio, el estilo CSS no cambiará a una configuración de consulta de medios diferente;
• Si está utilizando el ancho máximo , cuando cambia el tamaño del navegador en su escritorio, el CSS cambiará a una configuración de consulta de medios diferente y es posible que se muestre con el estilo para móviles, como menús táctiles.
max-device-width
funciona incluso si la<meta name="viewport" ...>
etiqueta no está incluida para dispositivos de pantalla pequeña ymax-width
no funciona sin unameta
etiqueta