Tipo de medios CSS: cómo cargar CSS para dispositivos móviles?

Question

Con este código:

<link rel="stylesheet" 
     type="text/css" 
     href="media/css/mobile.css" 
     media="handheld" /> 
<link rel="stylesheet" 
     type="text/css" 
     href="media/css/screen.css" 
     media="screen" /> 

en mi N78 navegador predeterminado y opera mini carga del Nokia screen.css en lugar de mobile.css.
¿Qué me estoy perdiendo?

Answer 1

Nokia N78 utiliza el navegador S60, que solo lee hojas de estilo de "pantalla". No leerá la "computadora de mano". No es compatible con la consulta de medios. En lugar de tratar de escribir todo aquí, echar un vistazo a este artículo y usted va a resolver el problema - http://www.alistapart.com/articles/return-of-the-mobile-stylesheet

Answer 2

Usando el iPhone como un ejemplo:

<link media="only screen and (max-device-width: 480px)" 
href="iPhone.css" type="text/css" rel="stylesheet" /> 

no tengo idea de lo que navegadores/dispositivos que esto hace y no funciona para. El único dispositivo móvil para el que he desarrollado es el iPhone. Pero estoy seguro de que puedes probarlo con tu nokia.

More on media queries

Answer 3

Opera Mini utiliza la pantalla de tipo de medio, ya que se ajusta a su comportamiento y las capacidades mejores. Sin embargo, utilizará hojas de estilo portátiles si cambia al modo de vista móvil. Vea A developer’s look at Opera Mini 5 beta 2 para más información.