Esta
generalmente es una etiqueta SPAN y DIV y puede ser colocada en cualquier
parte de la pantalla.
Con las etiquetas LAYER, podremos hacer lo mismo, la diferencia es que esta
etiqueta la reconoce Netscape y las ultimas versiones de I.E ( 5.0++ ).
Los links que los siguen en mis páginas, no es ni mas ni menos que
un Layer que dentro tiene un comando Java para que se pueda desplazar por
la pantalla ese Layer.
Hasta ahora hemos visto que tanto imágenes como textos, Applets de Java, etc,
solo se podrían colocar o bien a la derecha, izquierda o centrado; con el
Layer, esta barrera se vencen ya que se puede colocar cualquier objeto, en
la parte de la pantalla que quieramos.
Supongamos que tenemos el siguiente Layer:
<div
id="Layer2" style="position:absolute; width:178px; height:81px; z-index:5;
left: 577px; top: 334px; visibility: visible">
Donde:
id = es el
nombre, por cada uno que agreguemos, deberemos de cambiar el nombre de este.
style = nos
da la aposición donde se ubica.
width, height, left, top = es la distancia en pixels de estos.
Bien, ahora supongamos que quiero poner un texto dentro de este y ponerlo
en la parte de la pantalla que quiera. Para ello le insertare el siguiente
parámetro.
<div
id="Layer2" style="position:absolute; width:230px; height:28px; z-index:1;
left: 331px; top: 540px">
< font color="#0000FF" size="2" face="Verdana, Arial, Helvetica, sans-serif">
<b>
El texto aparecerá en color azul.
</font>
</div>
Note
los parámetros para este texto ( width, height, left, top ), esto nos
indica en que posición de la pantalla se encuentra el texto.
Si lo deseamos podremos insertar a este mismo texto una tabla dentro de este,
de la siguiente forma.
<div
id="Layer2" style="position:absolute; width:355px; height:45px; z-index:2;
left: 172px; top: 826px">
<table width="104%" border="1" cellspacing="1" cellpadding="1" height="44"
align="left">
<tr>
<td>< font color="#0000FF" size="2" face="Verdana, Arial, Helvetica,
sans-serif">
<b><a href="mailto:cx1ddr@internet.com.uy">Pulse aquí
para mandarme un correo electrónico, gracias por leer este manual</a>
</b></font></td></tr>
</table>
</div>
Este se vera
así:
También si lo desea podrá poner una imagen o texto, encima de otro texto o de otra imagen, esta es la forma:
TENGAN
PRESENTE QUE ESTAS SON DOS IMÁGENES GIF, UNIDAS POR UN LAYER.
El código
para este caso, será:
<div
id="Layer2" style="position:absolute; width:71px; height:58px; z-index:4;
left: 398px; top: 929px">
< img src="uruguay.gif"
width="70" height="61">
</div>
<div id="Layer2"
style="position:absolute; width:67px; height:59px; z-index:3; left: 354px;
top: 899px">
< img src="escudo1.gif" width="70" height="61">
</div>
Layers
Anidados
Estos nos permiten colocar un layer dentro de otro. Es decir, nos servirá
en el momento que quieramos agrupar layers.
Acá les pongo un ejemplo de layer agrupados, se deberán colocar
los textos o imágenes dentro de estos.
<div
id="Parent" style="position:absolute; left:56px; top:54px; width:124px; height:158px;
z-index:1;">
Contenido situado en el interior del layer padre.
<div id="Nested" style="position:absolute; left:97px; top:114px; width:54px;
height:69px; z-index:1;">
Contenido situado en el interior del layer anidada.
</div>
</div>
Esto
nos permitirá que ambos layers se desplacen juntos dentro de la pantalla.
Esto es todo y espero que les agrade el reporte.