Imágenes

El lenguaje Html tiene una etiqueta específica para incluir imágenes en un documento: la etiqueta <img>. Tiene atributos para definir cómo debe mostrarse la imagen y su comportamiento, y no existe etiqueta de cierre.

Aunque hay muchos formatos de imagen, en la web sólo se usan tres:

Atributos de <img>






Ejemplos:

<!-- imagen sola -->
<img src="libros.gif" width="48" height="47"  alt="libros">
libros

<!-- imagen sola con dimensiones cambiadas -->
<img src="libros.gif" width="88" height="66"  alt="libros">
libros

<!-- imagen dentro de un enlace -->
Con borde: <a href="https://es.wikipedia.org/wiki/Libro">
<img src="libros.gif" width="48" height="47" alt="libros"></a>
&nbsp; Sin borde: <a href="https://es.wikipedia.org/wiki/Libro">
<img src="libros.gif" width="48" height="47" alt="libros" border="0"></a>
&nbsp; Con borde más grueso: <a href="https://es.wikipedia.org/wiki/Libro">
<img src="libros.gif" width="48" height="47" alt="libros" border="5"></a>
Con borde: libros   Sin borde: libros   Con borde más grueso: libros

<!-- imagen animada con transparencia -->
<table border="0" align="center" cellspacing="20"><tr>
<td bgcolor="aqua"><img src="pez.gif" width="208" height="99" alt="pez"></td>
<td bgcolor="lime"><img src="pez.gif" width="208" height="99" alt="otro pez"></td>
</tr></table>
pez otro pez

<!-- imagen alineada a la derecha del resto -->
<table width="530" align="center"><tr><td>
<img src="galax.jpg" width="300" height="233" hspace="8" alt="Galaxia" align="right">
Texto de prueba para ver cómo se alinea una imagen cuando está junto a un texto
y etcetera etc., un texto o cualquier cosa en línea como otra imagen:
<img src="libros.gif" width="24" height="24" alt="libritos" align="middle">
y más texto seguido y a continuación...
<br><img src="pez.gif" width="208" height="99" title="pejcao">
</td></tr></table>
Galaxia Texto de prueba para ver cómo se alinea una imagen cuando está junto a un texto y etcetera etc., un texto o cualquier cosa en línea como otra imagen: libritos y más texto seguido y a continuación...