Esempio
Un'immagine-map, con aree cliccabili:
<img src="planets.gif"
width="145" height="126"
alt="Planets"
usemap="#planetmap">
<map
name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>
Prova tu stesso " Definizione e utilizzo
Il <area> tag definisce un'area all'interno di un'immagine-map (l'immagine-mappa è un'immagine con aree cliccabili).
Il <area> elemento è sempre nidificato all'interno di un <map> tag.
Nota: Il usemap attributo <img> tag è associato con il <map> attributo name dell'elemento, e crea una relazione tra l'immagine e la mappa.
Supporto per il browser
| Elemento | |||||
|---|---|---|---|---|---|
| <area> | sì | sì | sì | sì | sì |
Differenze tra HTML 4.01 e HTML5
HTML5 ha alcune nuove caratteristiche, e alcuni attributi HTML 4.01 non sono più supportati.
Differenze tra HTML e XHTML
In HTML il <area> tag non ha alcun tag di chiusura.
In XHTML il <area> tag deve essere ben chiuso.
attributi
= Nuovo in HTML5.
| Attributo | Valore | Descrizione |
|---|---|---|
| alt | text | Specifica un testo alternativo per la zona. Richiesto se il href attributo è presente |
| coords | coordinates | Specifica le coordinate della zona |
| download | filename | Specifica che l'obiettivo sarà scaricato quando un utente fa clic sul collegamento ipertestuale |
| href | URL | Specifica la destinazione del collegamento ipertestuale per l'area |
| hreflang | language_code | Specifica la lingua del URL di destinazione |
| media | media query | Specifica ciò che i media / device l'URL di destinazione è ottimizzato per |
| nohref | value | Non supportato in HTML5. Specifica che una superficie che non è associata collegamento |
| rel | alternate author bookmark help license next nofollow noreferrer prefetch prev search tag | Specifica la relazione tra il documento corrente e l'URL di destinazione |
| shape |
default rect circle poly | Specifica la forma dell'area |
| target | _blank _parent _self _top framename | Specifica dove aprire l'URL di destinazione |
| type | media_type | Specifica il tipo di supporto della URL di destinazione |
attributi globali
Il <area> tag supporta anche l' Attributi globali in HTML .
Attributi eventi
Il <area> tag supporta anche l' evento Attributi in HTML .
Pagine correlate
Di riferimento HTML DOM: Area Object
Impostazioni predefinite CSS
La maggior parte dei browser visualizzerà il <area> elemento con i seguenti valori di default:
area {
display:
none;
}