Los dispositivos como iPad e iPhone cada vez están más cerca de nuestra vida cotidiana, por ello hay que adaptarse a los nuevos tiempos y crear, estilizar y construir páginas adaptadas a los nuevos medios. De una manera muy sencilla, con el uso de CSS3 Media Queries podemos detectar si el usuario está usando un iPad o un iPhone, y, de esta manera, enlazar dicho dispositivo a su respectivo documento CSS.

En teoría sería así:

Select Code
1
2
3
4
<link rel="stylesheet" media="all and (max-device-width: 480px)" href="formato-iphone.css">
<link rel="stylesheet" media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" href="formato-ipad.css">
<link rel="stylesheet" media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" href="formato-ipad-horizontal.css">
<link rel="stylesheet" media="all and (min-device-width: 1025px)" href="formato-ipad-horizontal.css">


Luego mediante esos documentos podremos estilizar el documento adecuándolo al dispositivo en el que se encuentre el usuario, de forma sencilla.

Vía | O’Reilly

Si te ha gustado este artículo, puedes recibir gratis más y mejor por RSS, Twitter, Facebook o correo electrónico. ¡Muchas gracias por leerme!