Imágenes en HTML
Para visualizar una imagen en un documento HTML se puede utilizar el elemento "img".
Elemento "img"
EJEMPLO Si en pantalla se quiere ver, por ejemplo, la siguiente imagen con el logo de Abrirllave:
Se puede escribir ("una-imagen.html"):
<!DOCTYPE html>
<html lang="es-ES">
<head>
<meta charset="utf-8">
<title>Ejemplo de una imagen</title>
</head>
<body>
<img src="logo-abrirllave.gif" width="230" height="60" alt="Logo de Abrirllave.com">
</body>
</html>Como se puede observar, el elemento "img" no necesita la etiqueta de cierre (</img>) ya que no tiene contenido. Ahora bien, véase que en "img" se han escrito varios atributos.
Atributo src
El atributo src sirve para indicar la ubicación de la imagen que se quiere mostrar en el navegador web. En este caso, la imagen debe estar en la misma carpeta que el archivo "una-imagen.html".
Atributos width y height
witdth y height permiten especificar, respectivamente, la anchura y la altura de la imagen en píxeles.
Atributo alt
El atributo alt sirve para indicar un texto que se mostrará en pantalla en el caso de que la imagen no se encontrara.
EJEMPLO Si en "una-imagen.html", en vez de "logo-abrirllave.gif", por error se hubiese escrito "logoabrirllave.gif", al visualizar el documento HTML se vería algo parecido a:
| Ejercicio resuelto |
|---|