Hay una diferencia entre insertar una imagen en una página web y hacer que esa imagen sea un enlace en el que se puede hacer clic. Aunque el HTML es similar, un enlace se basa en un elemento de anclaje mientras que una imagen usa el elemento img . Sin embargo, una imagen puede anidar dentro de un ancla, haciendo que esa imagen sea clicable como un enlace.
Insertar imágenes en elementos de anclaje
Un uso común de un enlace basado en imágenes es el gráfico del logotipo del sitio & amp; apos; s, que luego se vincula a la página de inicio del sitio & amp; apos; s.
Video destacado
Aquí y amp; apos; s cómo colocaría una imagen no clicable en el documento HTML:
Para transformar la imagen en un enlace, agregue el enlace del ancla, abriendo el elemento del ancla antes de la imagen y cerrando el ancla después de la imagen. Esta técnica es similar a cómo vincula el texto, excepto que en lugar de envolver las palabras, envuelve la imagen:
Cuando agregue este tipo de HTML a su página, don & amp; apos; t coloque espacios entre la etiqueta de anclaje y la etiqueta de imagen. Si lo hace, algunos navegadores agregarán pequeñas garrapatas al lado de la imagen, lo que se verá extraño.
El logotipo ahora también actúa como un botón de página de inicio, que es prácticamente un estándar web en estos días.
Observe que no incluimos ningún estilo visual, como el ancho y la altura de la imagen, en nuestro marcado HTML. Dejaremos estos estilos visuales a CSS y mantendremos una separación limpia de la estructura HTML y los estilos CSS.
& amp; # x203A; Informática