HTML Imágenes - El Tag <img> y el atributo Src
En HTML, las imágenes se definen con la etiqueta <img>.
La etiqueta <img> está vacío, lo que significa que contiene atributos solamente, y no tiene etiqueta de cierre.
Para mostrar una imagen en una página, es necesario utilizar el atributo src. Src significa "fuente". El valor del atributo src es la dirección URL de la imagen que desea mostrar.
Sintaxis para la definición de una imagen:
<img src="url" alt="some_text">
La dirección URL apunta a la ubicación donde se almacena la imagen. Una imagen denominada "boat.gif", ubicado en el directorio "imágenes" en "www.w3schools.com" tiene la URL: http://www.w3schools.com/images/boat.gif.
El navegador muestra la imagen en la que se produce la etiqueta <img> en el documento. Si pones una etiqueta de imagen entre dos párrafos, el navegador muestra el primer párrafo, a continuación, la imagen, y luego el segundo párrafo.
HTML Imágenes - El Alt Atributo
El atributo alt requerida especifica un texto alternativo para una imagen, si la imagen no se puede visualizar.
El valor del atributo alt es un texto definido por el autor:
<img src="smiley.gif" alt="Smiley face">
El atributo alt proporciona información alternativa para una imagen si un usuario por alguna razón no puede verlo (a causa de conexión lenta, un error en el atributo src, o si el usuario utiliza un lector de pantalla).
HTML Imágenes - Altura Establecer y ancho de una imagen
Los atributos de altura y anchura se utilizan para especificar la altura y la anchura de una imagen.
Los valores de los atributos se especifican en píxeles por defecto:
<img src="smiley.gif" alt="Smiley face" width="42" height="42">
Consejo: Es una buena práctica para especificar la altura y anchura de los atributos de una imagen. Si se establecen estos atributos, el espacio requerido para la imagen está reservado cuando se carga la página. Sin embargo, sin estos atributos, el navegador no sabe el tamaño de la imagen. El efecto será que el diseño de la página va a cambiar durante la carga (mientras que las imágenes se cargan).
Notas básicas - Consejos útiles
Nota: Si un archivo HTML contiene imágenes diez - se requieren archivos de once para mostrar la página de la derecha.Cargando imágenes toma tiempo, así que mi mejor consejo es: Usar imágenes cuidadosamente.
Nota: Cuando se carga una página web, es el navegador, en ese momento, que en realidad se pone la imagen de un servidor web y lo inserta en la página. Por lo tanto, asegúrese de que las imágenes realmente se quedan en el mismo lugar en relación con la página web, de lo contrario sus visitantes tendrán un icono de enlace roto. El icono de enlace roto se muestra si el navegador no puede encontrar la imagen.
Más ejemplos
Deje un flotador de la imagen a la izquierda ya la derecha
¿Cómo dejar que un flotador de la imagen a la izquierda oa la derecha de un párrafo.
¿Cómo dejar que un flotador de la imagen a la izquierda oa la derecha de un párrafo.
Hacer un hipervínculo de una imagen
¿Cómo usar una imagen como un enlace.
¿Cómo usar una imagen como un enlace.
Crear un mapa de imagen
¿Cómo crear un mapa de imagen, con regiones seleccionables. Cada región es un hipervínculo.
¿Cómo crear un mapa de imagen, con regiones seleccionables. Cada región es un hipervínculo.
HTML etiquetas de imagen
| Tag | Description |
|---|---|
| <img> | Defines an image |
| <map> | Defines an image-map |
| <area> | Defines a clickable area inside an image-map |
No hay comentarios:
Publicar un comentario