miércoles, 30 de octubre de 2013

Adaptar Página Web a Pantalla Completa, Tablet o Celular

Adaptar Página Web a Pantalla Completa, Tablet y Celular


La solución consiste en utilizar tamaños relativos en la página (que cambien según el tamaño de la ventana y de la pantalla de los usuarios). Lo más común es utilizar la etiqueta body.

Para adaptar el tamaño de la página, debemos ubicar:

1. El estilo CSS - Body (Click en Ventana - Estilo CSS)
2. Doble click en "Body" saldrá una ventana llamada "Definición de Regla"
3. En categoría click en Cuadro y poner tal como lo detallo aquí abajo:

body{width:100%;}
{height:100%;}


Padding: CHEK en "Igual Para Todo"
Top: 0 (Px); Right: 0 (Px); Bottom: 0 (Px); Left 0 Px)

Margin: CHECK "Igual Para Todo"
Top: auto (Px); Right: auto (Px); Bottom: auto (Px); Left auto Px)

Con este código la página ocupara el 100% de la ventana, cualquiera sea su tamaño.



Recomendación: Hacer el mismo proceso en el "Estilo CSS" html, body (Sí es que lo tienes - Opcional)









No hay comentarios:

Publicar un comentario en la entrada