El siguiente fragmento HTML define 5 layers los cuales producen un efecto de empalmado :

  
<!-- LAYER DE FONDO -->
<div style="position: absolute; left: 300px; top: 550px; width: 200px; height: 150px; 
               background-color: red; z-Index='-1'">
</div>

<!-- LAYER 1er RENGLON -->
<div style="position: absolute; left: 330px; top: 560px; width: 200px; height: 150px;z-Index='5'">
        <h2> Layers </h2>
</div>

<div style="position: absolute; left: 330px; top: 562px; width: 200px; height: 150px;z-Index='10'">
        <h2> Layers </h2>
</div>


<!-- LAYER 2do RENGLON -->
<div style="position: absolute; left: 350px; top: 600px; width: 200px; height: 150px;z-Index='5'">
        <h2> con &lt;DIV&gt; </h2>
</div>

<div style="position: absolute; left: 350px; top: 602px; width: 200px; height: 150px;z-Index='10'">
        <h2> con &lt;DIV&gt; </h2>
</div>

El efecto generado por esta definición es reproducido a continuación :

Como se puede observar de las definiciones anteriores, el uso del elemento <div> es relativamente sencillo ya que define únicamente el atributo style (parte de CSS) que contiene las características de la capa, el significado de su contenido es el siguiente:

• position: abosolute: Indica que la posición de la capa es absoluta a la pantalla, esto es, la coordenada (0,0) se refiere a la esquina superior izquierda; una alternativa de este valor sería position: relative que indica una posición relativa a la definición del elemento <div>.

• left: 300px; top:550px : Define la posición en pixels de la capa, respecto al margen izquierdo (left: 300px) y superior (top:550px ).

• width: 200px; height: 150px; : Indica el ancho y altura del "layer" respectivamente.

• background-color: red; : Especifica el color de fondo para la capa.

• z-Index='-1'": Empleado para indicar una posición relativa del "layer", esto es, aquellos números inferiores son colocados como base mientras los superiores son empalmados por arriba de estos.

Una vez definidas las características del elemento <div>, pueden ser colocados dentro de éste los diversos tags HTML que formarán parte de la capa ("layer"), para posteriormente cerrarse la declaración a través del Tag </div>.

A continuación se describe esta misma definición en DHTML con el uso del Tag <layer> para uso en Navegadores "Netscape" en versiones inferiores a la 5 (Las versiones más recientes (7.0) ya emplean el elemento <div> correctamente) :

 
<!-- LAYER DE FONDO -->
<layer left="300" top="550" width="200" height="150" bgcolor="red" z-index="-1"> 

<!-- LAYER 1er RENGLON -->
  <layer left="20" top="30" z-index="5">
     <h2> Layers </h2> 
  </layer> 
  <layer left="20" top="32" z-index="10">
     <h2> Layers </h2>
  </layer> 

<!-- LAYER 2do RENGLON -->
  <layer left="50" top="70" z-index="5">
     <h2> con &lt;LAYER&gt; </h2> 
  </layer> 
  <layer left="50" top="72" z-index="10">
     <h2> con &lt;LAYER&gt; </h2>
  </layer> 

<!-- TERMINA LAYER DE FONDO -->
</layer>