Índice
 
   
7. Las capas

Netscape y Microsoft soportan HTML Dinámico a partir de las versiones 4 de sus navegadores, si bien hay diferencias sustanciales en lo que cada compañía quería decir cuando lo utilizaba.

Características comunes:

·        Utilización de plantillas de estilo para controlar la presentación del contenido.

·        Colocación precisa del contenido en la ventana del navegador.

·        Carga de fuentes para que el navegador las utilice cuando presente texto.

La forma que cada navegador soporta estas características no son las mismas. IE 4 utiliza una aproximación a través de las plantillas de estilo en cascada para realizar la colocación de contenido en pantalla. Netscape introdujo dos tags diferentes para manejar la colocación: <layer> e <ilayer>.

En este capítulo estudiaremos como trata internet explorer las capas.

Una capa es un contenedor de HTML que generalmente traza la etiqueta DIV o SPAN y que puede colocar en cualquier lugar de la página. Las capas pueden contener texto, imágenes, formularios, objetos plug-ins e incluso otras capas.

Microsoft Internet Explorer 4.0 y Netscape Navigator 4.0 admiten las capas creadas utilizando las etiquetas DIV y SPAN . Sólo Navigator admite las capas creadas con las etiquetas LAYER e ILAYER . Las versiones anteriores de ambos exploradores muestran el contenido de la capa, pero no lo colocan.

Las etiquetas principales para hacer una capa son las siguientes:

Capas
Etiqueta Propiedades
<div></div> Esta etiqueta delimita el contenido de la capa.  

Propiedad Dato
ID Nombre de la capa. Se utiliza para referirse a ella en otros tags o en código JavaScript. 
STYLE Establece un estilo de capa.
POSITION Absolute | Relative
LEFT Distancia en pixels respecto al margen inferior.
TOP Distancia en pixels respecto al margen superior.
WIDTH Ancho de la capa.
HEIGHT Alto de la capa.
Z-INDEX Profundidad de la capa. Números mayores indican menor profundidad.
VISIBILITY Indica si la capa es o no visible: visible | hidden.

Ejemplo:
<div id="layer1" style="position:absolute; left:50px; top:100px; width:96px; height:19px; z-index:1; visibility:visible;">contenido capa</div>