Enlaces
Una de las características básicas del HTML (probablemente la más importante) es la capacidad de enlazar páginas.
Los enlaces se hacen mediante la directiva <A>. Es una directiva que exige cierre </A>. El modificador más importante es HREF, que indica la dirección del fichero al que se enlaza. Recordar que, el nombre del fichero al que se enlaza, por ser el valor de un modificador, debe ir siempre entre comillas.
Aquí se muestra un enlace a otra página.
|
Código fuente. |
Resultado. |
|
<P><A HREF="homer.htm"> <B>Homer</B> </A> |
En el caso anterior, como el fichero al que se enlaza está en el mismo directorio que el fichero origen, no ha sido necesario indicar la ruta. Sin embargo, no siempre es así. Muchas veces el fichero de destino se encuentra en un directorio dentro del directorio actual, o en un directorio superior... Puede ocurrir, incluso, que el fichero de destino no se encuentre en nuestro servidor.
A continuación, se muestran los códigos a ficheros situados en directorios
diferentes al del fichero origen.
|
Código fuente. |
Resultado. |
|
<P><A HREF="directorio/index.htm"><B>Index</B></A> |
Enlace a un fichero almacenado en un subdirectorio dentro del actual. (El código "entra" dentro del directorio). |
|
<P><A HREF="../index.htm"><B>Index</B></A> |
Enlace a un fichero almacenado en un directorio superior al actual. (El código "sube" un directorio). |
|
<P><A HREF="../directorio/index.htm"><B>Index</B></A> |
Enlace a un fichero almacenado en un directorio distinto
del actual pero a un mismo nivel. (El código "sube" un directorio y
"entra" en otro).
|
|
<P>
|
Enlace a una página situada en otro servidor. Hay que dar la
dirección URL completa.
|
Aquí, lo que se carga no es una página web, sino un fichero
gráfico.
|
Código fuente. |
Resultado. |
|
<P>
|
También es posible definir el enlace utilizando una imagen en vez de texto.
En los ejemplos que se muestran a continuación, ambas imágenes enlazan
con otro fichero. En la primera de ellas la imagen muestra un borde azul.
Este borde lo muestra por defecto el navegador, pero se ha eliminado en la
segunda imagen.
|
Código fuente. |
Resultado. |
|
<P>
|
|
|
<P>
|
|
El enlace también puede servir para enviar un mensaje de correo
electrónico:
|
Código fuente. |
Resultado. |
|
<P>
|