Cómo hacer que una página web se ajuste al tamaño del monitor

Escrito por brandy alexander | Traducido por carlos alberto feruglio
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo hacer que una página web se ajuste al tamaño del monitor
Usa CSS para hacer que tus páginas web se ajusten a cualquier tamaño de monitor. (Monitor image by Caila from Fotolia.com)

Tus páginas web tienen una medida horizontal (resolución) que determina el ancho de la página. Una resolución ideal depende del tamaño del monitor del usuario. Si bien no es posible predecir las dimensiones de la pantalla de cada visitante, tienes la opción de utilizar una regla de estilo de hoja de estilos en cascada (CSS por sus siglas en inglés) con tu lenguaje de marcado de hipertexto (HTML por sus siglas en inglés). Usando el editor de texto de tu equipo, agrega el estilo CSS que permita que tu página web se adapte al tamaño de la pantalla del espectador.

Nivel de dificultad:
Moderado

Otras personas están leyendo

Instrucciones

  1. 1

    Inicia tu programa de edición de texto y abre el documento HTML.

  2. 2

    Busca las etiquetas "<head></head>" en la parte superior de tu archivo y escribe el siguiente marcador de posición de CSS: <head> <style type="text/css"> {} </ style> </ head>

  3. 3

    Escribe "body" antes de las llaves e introduce "width:" dentro de los corchetes de la siguiente manera: body {width:}

  4. 4

    Escribe "100%", después de la entrada de anchura y sigue esto con un punto y coma. Esta configuración permite a un usuario ampliar o reducir la página al tamaño de su monitor, pero no interfiere con el diseño de tu sitio. El código completo se verá así: <head> <style type="text/css"> body { width: 100%; } </style> </head>

  5. 5

    Guarda el documento. Tu página ahora se ajusta al tamaño del monitor del visitante.

No dejes de ver

Filtrar por:
  • Mostrar todos
  • Artículos
  • Galerías de fotos
  • Videos
Ordenar:
  • Más relevante
  • Más popular
  • Más reciente

No se encuentran artículos disponibles

No se encuentran slideshows disponibles

No se encuentran videos disponibles