HTML soporta imágenes de muchos tipos, para poder incluirlas usaremos la etiqueta img principalmente (pueden ser usadas desde el CSS también).
<img src="https://tic.seperians.es/wp-content/uploads/2020/03/mary-kenneth-keller1.jpg" alt="" width="320" height="260"/>
Resultado del código superior:
La etiqueta img no necesita cierre, no se usa </img>. Ahora bien, la etiqueta img soporta una serie de atributos básicos que nos sirven como modificadores de la misma:
- src: Aquí (entre comillas, como en el resto de estos atributos) pondremos el enlace directo a la imagen
- width: Ancho de la imagen
- height: Alto de la imagen
- alt: Texto que aparecerá en caso de no poder cargarla
Ejemplos:
Esta es la imagen superior con ancho 640 y alto 520:
Este es un ejemplo de mala carga de la imagen:
Además, es muy recomendable hipervincular la imagen a su fuente, para esto rodearemos la etiqueta img con una etiqueta <a>, a la que le pondremos un atributo href=»url del vinculo».
¡Recordad cargar vuestras imagenes desde un sitio que sepáis donde van a mantenerse!