Búsqueda personalizada
 
 
 
 
Hipervínculo mediante una imagen <a> y <img>
 

Como ya conocemos los hipervínculos y como insertar imágenes en nuestra página, ahora podemos implementar un hipervínculo pero en vez de mostrar un texto mostraremos una imagen.

La solución es simple y consiste en disponer la marca <img> encerrada entre la marca de comienzo y fin del enlace(<a>)

Confeccionemos una página que muestre dos imagenes (foto1.jpg y foto2.jpg) como hipervínculos. Al ser presionados llamar a otra página.

Las imágenes se encuentran en una carpeta llamada imagenes que depende directamente de la raiz del sitio:

<html>
<head>
</head>
<body>
<h2>Presione alguna de las imagenes para conocer ms 
sobre esa obra.</h2>
<a href="pagina2.html"><img src="/imagenes/foto1.jpg" 
alt="Paisaje"></a>
<br>
<a href="pagina2.html"><img src="/imagenes/foto2.jpg" 
alt="Paisaje 2"></a>
</body>
</html>

Como podemos observar insertamos la marca HTML img en el lugar donde disponíamos el texto del hipervínculo. Eso es todo.

Lo que debe quedar bien en claro es que las imágenes se encuentran en un directorio llamado imagenes en la raiz del sitio (luego para indicar la referencia al archivo lo hacemos antecediendo la barra invertida / con lo que hacemos referencia a que partimos desde la raiz del sitio) en una carpeta llamada imagenes (/imagenes/foto1.jpg)

Es bueno practicar con esto ya que cuando implementemos sitios muy grandes seguramente agruparemos cada módulo en distintas carpetas.

 
 
 
 
       

¿Quienes somos?

Condiciones de uso

Publicidad

Privacidad de la informacion