Definições e uso
A tag <area> define uma área dentro de um mapa de imagem (um mapa de imagem é uma imagem com áreas clicáveis). define uma relação entre o documento atual e um recurso externo.
Os elementos <area> estão sempre aninhados dentro de uma tag <map>.
Observação: o atributo usemap em <img> está associado ao atributo name do elemento <map> e cria um relacionamento entre a imagem e o mapa.
Exemplos
<img src="workplace.jpg" alt="Workplace" usemap="#workmap" width="400" height="379">
<map name="workmap">
<area shape="rect" coords="34,44,270,350" alt="Computer" href="computer.htm">
<area shape="rect" coords="290,172,333,250" alt="Phone" href="phone.htm">
<area shape="circle" coords="337,300,44" alt="Cup of coffee" href="coffee.htm">
</map>
Atributos
| Atributo | Valor | Descrição |
|---|---|---|
| alt | text | Especifica um texto alternativo para a área. Obrigatório se o atributo href estiver presente. |
| coords | coordinates | Especifica as coordenadas da área. |
| download | filename | Especifica que o destino será baixado quando um usuário clicar no hiperlink. |
| href | URL | Especifica o destino do hiperlink para a área. |
| hreflang | language_code | Especifica o idioma do URL de destino. |
| media | media query | Especifica para qual mídia/dispositivo o URL de destino é otimizado. |
| referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin same-origin strict-origin-when-cross-origin unsafe-url |
Especifica quais informações do referenciador enviar com o link. |
| rel | alternate author bookmark help license next nofollow noreferrer prefetch prev search tag |
Define uma folha de estilo preferida ou alternatiEspecifica a relação entre o documento atual e o URL de destino. |
| shape/td> | default rect circle poly |
Especifica a forma da área. |
| target/td> | _blank _parent _self _top framename |
Especifica a forma da área. |
| type/td> | media_type | Especifica o tipo de mídia do URL de destino. |
Esta tag também suporta Atributos Globais.