Scribd
Cargar
3 vistas2 páginas

Uso de Imágenes en HTML: Guía Completa

El documento explica cómo insertar y manipular imágenes en HTML usando la etiqueta <img/> y el atributo src para especificar la ubicación de la imagen. También se abordan aspectos como el tamaño de la imagen, la alineación horizontal y vertical, y se enumeran los formatos de imagen más comunes compatibles con navegadores. Se incluyen ejemplos prácticos para ilustrar cada concepto.

Cargado por

Jonathan Villamar
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
3 vistas2 páginas

Uso de Imágenes en HTML: Guía Completa

El documento explica cómo insertar y manipular imágenes en HTML usando la etiqueta <img/> y el atributo src para especificar la ubicación de la imagen. También se abordan aspectos como el tamaño de la imagen, la alineación horizontal y vertical, y se enumeran los formatos de imagen más comunes compatibles con navegadores. Se incluyen ejemplos prácticos para ilustrar cada concepto.

Cargado por

Jonathan Villamar
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd

HTML – Imágenes

Las imágenes son muy importantes en una página web. Por lo tanto es
conveniente utilizarlas de manera correcta. Inserta imágenes usando la
etiqueta <img/>.
Ejemplo:
<img src="pic_trulli.jpg" alt="Nombre de la imagen">
Imágenes en una carpeta
Si tiene sus imágenes en una subcarpeta, debe incluir el nombre de la carpeta
en el src atributo:
Ejemplo:
<img src="imagenes/tucan_0.jpg">
Tamaño de imagen: ancho y alto
Puede utilizar el styleatributo para especificar el ancho y el alto de una imagen.
Ejemplo:
<img src="imagenes/9_de_oct.jpg" alt="Ciudad" width="400" height="240">
Formato imagen en sub carpetas.
Ejemplo:
<img src="imagenes/gifs/[Link]" alt="HTML5 Icon"
style="width:128px;height:128px;">
"src" es el acceso directo para "source". Este atributo es usado para indicar la
ubicación de la foto.
Enlace local Descripción
src="[Link]" la imagen está ubicada al mismo nivel
del archivo .html
src="../[Link]" la imagen está ubicada en un nivel
previo al archivo .html
src="../img/[Link]" la imagen está ubicada en la carpeta
"img" en un nivel previo al archivo .html
HTML - alineación horizontal y vertical de una imagen
Para esto utilizaremos los atributos align y valign. Las opciones ofrecidas por estos
atributos son:
Align (horizontal)
right (derecha)
left (izquierda)
center (centro)
Valigh (vertical)
top (arriba)
bottom (abajo)
center (centro)
Ejemplo:
<img align="right"src="imagenes/tucan_0.jpg" alt="Ave" width="400"
height="240">

Formatos de imagen comunes


Estos son los tipos de archivos de imagen más comunes, que son
compatibles con todos los navegadores (Chrome, Edge, Firefox, Safari,
Opera):
Abbreviation File Format File Extension
APNG Animated Portable .apng
Network Graphics
GIF Graphics Interchange .gif
Format
ICO Microsoft Icon .ico, .cur
JPEG Joint Photographic Expert .jpg, .jpeg, .jfif, .pjpeg,
Group image .pjp
PNG Portable Network Graphics .png
SVG Scalable Vector Graphics .svg

Link de apoyo:
[Link]

También podría gustarte