Con la proliferación de los teléfonos inteligentes como el iPhone, más y más sitios web están haciendo el salto hacia el mundo de los móviles con diseños que responden a diferentes tamaños de pantalla. Puede detectar tamaños de pantalla y definir estilos especiales para ellos el uso de CSS o Cascading Style Sheet, las consultas de los medios de comunicación. Escribe preguntas de los medios en sus hojas de estilo para determinar iPhone orientación apuntando las dimensiones de la pantalla de cada uno.
DETERMINAR IPHONE
Abra el archivo CSS y añadir este código en la parte inferior:
@ Media pantalla y sólo (max-device-width: 640px) {}
Esta consulta de medios maneja el retrato o vertical, la orientación de los iPhones.
Añadir otra consulta de medios por debajo de la primera, esta vez dirigidas a la orientación horizontal:
@ Media pantalla y sólo (min-device-width: 640px) y (max-device-width: 960px) {}
Escribe reglas CSS que se aplican a la orientación vertical dentro de la consulta de medios dirigido pantallas de 320 píxeles o menos. Haga lo mismo para la orientación horizontal, pero poner las reglas dentro de la consulta de medios para pantallas de menos de 480 píxeles:
@ Media pantalla y sólo (max-device-width: 640px) {h2 {font-size: 24px;}} @ media pantalla y sólo (min-device-width: 640px) y (max-device-width: 960px) { h2 {font-size: 36px;}}
Recuerde que sólo las reglas de estilo que difieren de lo que desea que aparezca en las pantallas regulares deben ir dentro de las preguntas de los medios. No repetir mucho código CSS, o será difícil de manejar.
Consejos y advertencias
Consultas de los medios de comunicación también trabajan para otros dispositivos móviles, sin importar la marca. Como siempre que se sepa el tamaño de la pantalla del dispositivo con el que desea orientar su campaña, puede crear estilos distintos para ella.
Excelente
ResponderEliminar