Home de Virtualnauta.com
Se protagonista de la Web

Virtualnauta > Tutorial HTML > Etiqueta img HTML

HTML

Etiqueta img HTML



Etiqueta de apertura: <img> Etiqueta de cierre: Prohibido

Definición

La etiqueta <img> incluye una imagen en el documento.

Esta imagen no es insertada tecnicamente en el documento, sino que se enlaza hacia el mismo.



Ejemplo

Código

<img src="flores.jpg" alt="Un ramo de flores" />
Resultado

Un ramo de flores


Posibles Atributos de la Etiqueta img

Referencias:
DTD nos indica en que DTD se permite cada atributo. S=Strict, T=Transitional, and F=Frameset.

Logo de Internet Explorer : Internet Explorer    Logo de Firefox : Firefox    Logo de Google Chrome : Google Chrome    Logo de Opera : Opera    Logo de Safari : Safari    


AtributosValorDescripciónSoportado por:DTDEj.
alt texto alternativo Requerido
Especifica un texto alternativo para la imagen.
Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari STF Ejemplo básico de como insertar una imagen con un texto alternativo
src URL Requerido
Especifica la dirección URL de la imagen.
Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari STF Ejemplo básico de como usar la dirección de la imagen
align left Desaprobado
Especifica la posición de una imagen con respecto a su contexto.
Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari TF
right
top
bottom
middle
border píxeles Desaprobado
Especifica el ancho del borde de una imagen en píxeles.
Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari TF
height píxeles Especifica la altura de la imagen. Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari STF Ejemplo de como definir la altura de una imagen en pixels
% Ejemplo de como definir la altura de una imagen en porcentaje
hspace píxeles Desaprobado
Especifica la cantidad de espacio en blanco a dejar a la derecha y a la izquierda de la imagen.
Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari TF
ismap ismap Especifica una imagen como mapa de imagen del lado del servidor. STF Ejemplo de como definir un mapa de una imagen
longdesc URL Especifica un enlace a una descripción larga de la imagen. No es soportado por el navegador Internet Explorer No es soportado por el navegador Firefox No es soportado por el navegador Google Chrome No es soportado por el navegador Opera No es soportado por el navegador Safari STF
usemap #nombre_del_mapa Especifica una imagen como mapa de imagen del lado del cliente. Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari STF Ejemplo de como definir un mapa de una imagen
vspace píxeles Desaprobado
Especifica la cantidad de espacio en blanco a dejar arriba y abajo de la imagen.
Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari TF
width píxeles Especifica el ancho de la imagen. Soportado por el navegador Internet Explorer Soportado por el navegador Firefox Soportado por el navegador Google Chrome Soportado por el navegador Opera Soportado por el navegador Safari STF Ejemplo de como definir el ancho de una imagen en pixels
%



Atributos Estándard de la Etiqueta img

Estos atributos son soportados por todos los navegadores
Logo de Internet Explorer : Internet Explorer    Logo de Firefox : Firefox    Logo de Google Chrome : Google Chrome    Logo de Opera : Opera    Logo de Safari : Safari    


AtributosValorDescripción
classnombre de la claseAsigna un nombre de clase.
El atributo class actúa:
  • Como selector para las hojas de estilo(CSS), cuando se asigna información de estilo a un conjunto de elementos.
  • Para procesos generales por parte del usuario.
idnombreAsigna un nombre a un elemento.
El atributo id actúa:
  • Como selector para las hojas de estilo(CSS).
  • Como vínculo destino para vínculos de hipertexto.
  • Como medio de hacer referencia a un elemento en particular desde un script.
  • Como nombre de un elemento object declarado.
  • Para procesos generales por parte del usuario.
styleestiloEste atributo especifica información de estilo para el elemento actual.
titlenombreEste atributo ofrece información consultiva sobre el elemento para el cual se establece.
dirltr o rtlEspecifica la dirección del texto.
Valores posibles:
  • ltr : De izquierda a derecha (left to right).
  • rtl : De derecha a izquierda (right to left).
langcódigo de lenguajeEspecifica el idioma base de los valores de los atributos y del texto contenido en un elemento.
El atributo lang es útil para:
  • Ayudar a los motores de búsqueda.
  • Ayudar a los sintetizadores de voz.
  • Ayudar al agente de usuario a hacer decisiones sobre separación de palabras, ligaduras, y espaciado.
  • Ayudar a los verificadores de ortografía y gramática.



Eventos de la Etiqueta img

Los eventos son soportados por todos los navegadores
Logo de Internet Explorer : Internet Explorer    Logo de Firefox : Firefox    Logo de Google Chrome : Google Chrome    Logo de Opera : Opera    Logo de Safari : Safari    


EventoValorDescripción
onkeydownscriptEl script corre cuando se pulsa una tecla.
onkeypressscriptEl script corre cuando se pulsa y se suelta una tecla.
onkeyupscriptEl script corre cuando una tecla se suelta.
onclickscriptEl script corre cuando se hace clic con el mouse.
ondblclickscriptEl script corre cuando se hace doble clic con el mouse.
onmousedownscriptEl script corre cuando el botón del mouse se pulsa cuando está encima de un elemento.
onmousemovescriptEl script corre cuando el mouse se mueve mientras está sobre un elemento.
onmouseoutscriptEl script corre cuando el mouse se aparta de un elemento.
onmouseoverscriptEl script corre cuando el mouse se sitúa sobre un elemento.
onmouseupscriptEl script corre cuando el botón del mouse se suelta cuando está encima de un elemento.




¿No encuentras lo que buscas?




Artículos

Los mejores 10 hostings

Buscando cual es el mejor hosting que existe en el mercado, me he topado con una gran cantidad de sitios que presentan un ranking de los 10 mejores hosting del mundo. Como cada uno tiene en su lista, diferentes empresas de alojamiento web, en un orden de ranking muy distinto, he decidido investigar cual era la mejor. continúe leyendo...



Virtualnauta provee del material para uso exclusivo de aprendizaje.
No garantizamos que el contenido sea correcto.
El riezgo por el uso del mismo queda bajo la entera responsabilidad del usuario.
Mientras use este sitio, usted acuerda haber leido y aceptado nuestros términos de uso y privacidad.

Copyright 2007 - 2011 by Martín Solomiak. Todos los derechos reservados.


webmaster@virtualnauta.com

Mapa del sitio Valid XHTML 1.0 Transitional Valid CSS!