Unidad 14. Capas (II)


14.2. Capas <div>

Las capas no son más que unos recuadros, elementos de bloque, destinados a contener y agrupar otros elementos, igual que los párrafos son elementos de bloque destinados a contener texto.

Ésta es una capa con borde verde

Las capas, también llamadas layers o divisiones, se crean con la etiqueta <div></div>.

Al ser elementos contenedores, son muy útiles para organizar nuestros elementos. Si esto lo combinamos con el posicionamiento absoluto, una propiedad CSS que nos permite colocar los elementos donde queramos en nuestra página, obtenemos los elementos ideales para maquetar nuestra página, es decir, distribuir el contenido en bloques.

En la imagen de arriba vemos varias capas azules distribuidas sobre una capa gris. Si estrechas o agrandas la ventana del navegador, verás que pueden llegar a solaparse.

Cuando convertimos una capa en un elemento con posición absoluta (elemento PA), se muestra así en Dreamweaver:

Capa PA

Las capas con posición absoluta pueden moverse de una posición a otra de la ventana pulsando sobre el recuadro blanco, y sin soltar el ratón, arrastrándola hacia la nueva posición.

También pueden ser redimensionadas pulsando sobre los recuadros negros, y arrastrándolos hasta conseguir el tamaño deseado.

Dentro del recuadro de la capa es posible insertar texto, tablas, imágenes, animaciones flash, y todos los elementos que puede contener un documento HTML. Es posible incluso insertar a su vez otras capas, con lo que tendríamos capas anidadas.

Este icono sirve para seleccionar la capa al pulsar sobre él, y al eliminarlo se elimina también la capa.

 

Las capas, combinadas con JavaScript pueden dotar a una página de verdadero dinamismo.


Marzo-2015
Pág. 14.2
Atrás Inicio Adelante






Página inicial  Cursos Informática Gratuitos

Síguenos en:   Facebook ,    G+            Sobre aulaClic            Política de Cookies


© aulaClic S.L. Todos los derechos reservados. Prohibida la reproducción por cualquier medio.