ccc

CSS: Según dispositivo

/* PC o portátil */
<link rel="stylesheet" type="text/css" media="screen" src="screen.css">
En este caso no es necesario especificar el atributo media, podría ser así:
<link rel="stylesheet" type="text/css" src="css/screen1.css">

/*
Dispositivos o pantallas de ciertas características
Se cargará screen2.css en aquellas pantallas que tengan un ancho mínimo de 530px y TAMBIEN en aquellos dispositivos que tengan un ancho mínimo de 481 px
*/
<link rel="stylesheet" type="text/css"
media="only screen and (min-width:530px) and (min-device-width:481px)"
src="css/screen2.css">

/* Dispositivos smartphone o similares
Se cargará el screen3.css SOLO en aquellos dispositivos que tengan una pantalla con una ancho máximo de 480px
*/
<link rel="stylesheet" type="text/css"
media="only screen and (max-width:480px)"
src="css/screen3.css">

RESUMEN:
<link rel="stylesheet" media="screen" href="css/css_div.css">
<link rel="stylesheet" media="all and (max-device-width: 480px)" href="css/css_iphone.css">

No hay comentarios:

Publicar un comentario