IMAGENES EN HTML

El lenguaje HTML (HyperText Markup Language) permite estructurar y presentar contenido en la web. Una de sus funciones más importantes es la incorporación de elementos multimedia, como imágenes, videos y mapas, que enriquecen la experiencia del usuario y facilitan la comunicación visual.

1. Inserción de Imágenes

Las imágenes se agregan mediante la etiqueta <img>.

• Atributos principales:

• src: indica la ruta o URL de la imagen.

• alt: proporciona un texto alternativo para accesibilidad y SEO.

• width y height: definen el tamaño.

• <img src="imagen.jpg" alt="Descripción de la imagen" width="300" height="200">

  
  
  

• EN VISUAL STUDIO CODE solo es necesario poner "IMG" y autorrellenar todo y solo hay que poner el nombre correcto de la imagen con su respectiva extensión.

ACA TE DEJO UN EJEMPLO

DEBES COPIAR EXACTAMENT EL MISMO NONBRE DE LA IMAGEN CON SU EXTENSION REPITO, y la imagen debe estar en la misma carpeta donde se guarda el HTML y CSS

pero sugiero guardar todo en una subcarpeta.

Observa el resultado es muy bueno, solo tiene que ir ajustando los tamaños en tu HTML o en CSS.

te dejare un video para que observes lo interactivo que es ir intercalando los tamaños de la imagen.

Cómo puedes ver solo tengo que ir cambiando los números y la imagen cambian automáticamente,

los tamaños en HTML Y CSS se distribuyen por pixeles ósea "px".

• <img src="imagen.jpg" alt="Descripción de la imagen" width="300" height="200"

<img src="imagen.jpg" alt="Descripción de la imagen" width="300" height="200">