Etiqueta <area>


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

Definición

La etiqueta <area> se utiliza para definir regiones o areas dentro de un mapa de imágenes y los enlaces asociados a esas regiones.
Un mapa de imagenes es una imagen que permite clickear diferentes areas de la misma.
La etiqueta <area> siempre debe estar ubicada dentro de la etiqueta <map>

Ejemplo

Código
<img src="/formas.gif" border="0" width="225" height="251" usemap="#map1">

<map name="map1">
<area href="/cuadrado.html" shape=rect coords="0,75,100,175">
<area href="/circulo.html" shape=circle coords="175,50,50">
<area href="/triangulo.html" shape=poly coords="125,250, 225,250, 175,165">
</map>
Resultado

Posibles Atributos de la Etiqueta <area>

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    

Atributos Valor Descripción Soportado por: DTD Ej.
alt texto Requerido
Texto alternativo para el area.
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 Ejemplo de una imagen mapeada con el uso de las etiquetas map y area y sus atributos
coord coordenadas Especifica las coordenadas de un area. 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 una imagen mapeada con el uso de las etiquetas map y area y sus atributos
href URL Especifica el destino del enlace del area. 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 una imagen mapeada con el uso de las etiquetas map y area y sus atributos
nohref nohref Especifica que el area no tiene asociado ningún enlace. 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
shape default Especifica la forma de un area. 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
rect Ejemplo de una imagen mapeada con el uso de las etiquetas map y area y sus atributos
circle Ejemplo de una imagen mapeada con el uso de las etiquetas map y area y sus atributos
poly Ejemplo de una imagen mapeada con el uso de las etiquetas map y area y sus atributos
target _blank Espacios horizontales alrededor del applet. 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
_parent
_self
_top

Atributos Estándard de la Etiqueta <area>

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    

Atributos Valor Descripción
class nombre de la clase Asigna 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.
id nombre Asigna 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.
style estilo Este atributo especifica información de estilo para el elemento actual.
title nombre Este atributo ofrece información consultiva sobre el elemento para el cual se establece.
dir ltr o rtl Especifica la dirección del texto.
Valores posibles:
  • ltr : De izquierda a derecha (left to right).
  • rtl : De derecha a izquierda (right to left).
lang código de lenguaje Especifica 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.
accesskey caracter Asigna una tecla de acceso a un elemento. Al pulsar esa tecla el foco se dirige hacia ese elemento.
tabindex número Especifica el orden de tabulación del elemento dentro del documento actual

Eventos de la Etiqueta <area>

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    

Evento Valor Descripción
onblur script El script corre cuando el elemento pierde el foco ya sea con el mouse o por navegación con tabulador.
onfocus script El script corre cuando el foco se dirige hacia un elemento, ya sea con el mouse o por navegación con tabulador.
onkeydown script El script corre cuando se pulsa una tecla.
onkeypress script El script corre cuando se pulsa y se suelta una tecla.
onkeyup script El script corre cuando una tecla se suelta.
onclick script El script corre cuando se hace clic con el mouse.
ondblclick script El script corre cuando se hace doble clic con el mouse.
onmousedown script El script corre cuando el botón del mouse se pulsa cuando está encima de un elemento.
onmousemove script El script corre cuando el mouse se mueve mientras está sobre un elemento.
onmouseout script El script corre cuando el mouse se aparta de un elemento.
onmouseover script El script corre cuando el mouse se sitúa sobre un elemento.
onmouseup script El script corre cuando el botón del mouse se suelta cuando está encima de un elemento.


En la Web