webmaster adaptar una pagina web a diferentes resoluciones 3040 nke6nh

Rechercher
Recherche
Registrarse
Conexión

Trucos
Webmaster
CSS

Webmaster: Adaptar una página web a
diferentes resoluciones
Marzo 2015

Adaptar una página web a diferentes resoluciones:
centrarlaUna pregunta frecuente que aparece en los foros es ¿Cómo adaptar una
página web a la resolución de la pantalla de los usuarios? ¿Qué resolución
elegir?

Cómo adaptar una página web a diferentesresoluciones
La solución consiste en emplear tamaños relativos en la página (que se adapten al tamaño de la
ventana y de la pantalla de los usuarios). Lo mas común es utilizar la etiqueta body. Perotambién podemos utilizar div#corps u otro. Para adaptar el tamaño de la página, tenemos que
utilizar el código CSS:
body{width:100%;}
Con este código la página va a ocupar el 100% de la ventana,cualquiera sea su tamaño.
Evidentemente podemos definir el tamaño que queramos (90%, 80%, etc.) Si definimos uno más
pequeño, podemos centrar la página con margin:auto.

Nota

/!\ Atención: se debedefinir el tamaño en porcentaje (%) y no en em o alguna otra unidad
relativa, ya que % designa un porcentaje en relación al tamaño de la ventana, en cambio las
unidades em designan la altura de laslíneas (un tamaño predefinido).

Precisiones
Si es imprescindible que tu página no sea muy pequeña, puedes utilizar la propiedad min-width
(no funciona bajo IE). También puedes utilizar max-width paradefinir el tamaño máximo. No es
recomendable esto ya que no es agradable tener una página que sea más pequeña que la
ventana.

Ejemplo
Una página de ancho al 90%, centrada, con un ancho mínimo de 600pixeles, y con un ancho
máximo de 2000 píxeles:
body{width:90%;margin:auto;min-width:600px;max-width:2000px}
Este documento intitulado « Webmaster: Adaptar una página web a diferentes resoluciones »de Kioskea
(es.kioskea.net) esta puesto a diposición bajo la licencia Creative Commons. Puede copiar, modificar bajo las
condiciones puestas por la licencia, siempre que esta nota sea visible....