Cómo hacer que se expanda un DIV vacío

Escrito por chris hoke | Traducido por beatriz sánchez
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo hacer que se expanda un DIV vacío
Crea contenedores expandibles. (Jupiterimages/Photos.com/Getty Images)

Los contenedores DIV son elementos de página web que puedes usar para dar estilo, colocar y manipular otro contenido que esté entre las etiquetas de apertura "<DIV>" y cierre "</DIV>" del contenedor. Puedes dar estilo a los propios contenedores DIV con una variedad de propiedades CSS, y por este motivo se usan normalmente para crear un diseño de página para muchos sitios web. Si tienes un contenedor DIV vacío que quieres expandir vertical u horizontalmente para rellenar una zona disponible a su alrededor, puedes usar las propiedades CSS "width" (anchura) y "height" (altura). Esto puede ser útil cuando usas un DIV para mostrar una imagen de fondo.

Nivel de dificultad:
Moderadamente fácil

Otras personas están leyendo

Instrucciones

  1. 1

    Abre tu documento de página web en un editor de texto o HTML. Para abrir el documento en un editor de texto nativo de Windows, haz clic con el botón derecho sobre el archivo, y después pulsa "Abrir con". Haz clic en "Bloc de notas" en la lista de aplicaciones y después pulsa "Aceptar".

  2. 2

    Coloca el cursor en el lugar del documento de página web donde quieres que aparezca el contenedor DIV.

  3. 3

    Escribe "<DIV style="width:100%; height:100%;'></DIV>" para crear un contenedor DIV vacío con la propiedad CSS "width" en "100%" y la propiedad "height" en "100%". Esta configuración hará que el contenedor DIV vacío se expanda hasta llenar el espacio disponible a su alrededor. Si colocas el contenedor DIV dentro de las etiquetas de apertura y cierre de otro contenedor DIV, el DIV rellenará el espacio definido por el contenedor DIV externo.

  4. 4

    Cambia el valor de texto de la anchura "100" o altura en el paso anterior por un porcentaje diferente para que el contenedor DIV vacío se expanda en un trozo menor de espacio disponible a su alrededor. Cambia "100%" por un número y "px" para expandir el contenedor DIV hasta un determinado número de píxeles. Por ejemplo, para expandir un contenedor DIV vacío a una anchura de 400 píxeles y una altura de 200, escribe "<DIV style="width:400px; height:200px;'></DIV>".

  5. 5

    Haz clic en el menú "Archivo", y después en "Guardar" para guardar el documento de página web.

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