Opis

area definiuje obszar wewnątrz mapy obrazu (obrazu z klikalnymi obszarami).

Element jest zawsze zagnieżdżony w znaczniku <map>.

Uwaga: Atrybut usemap w znaczniku jest powiązany z atrybutem name elementu <map> (ta sama nazwa z #) i tworzy relację między obrazem a mapą.

Przykład
Planety Słońce Mercury Wenus Ziemia Mars Jowisz Saturn

Klikaj... i zauważ, że Saturn ściąga plik tekstowy (na który wskazuje href) miast go ładować do przeglądarki, Jowisz ściąga obraz jowisz.jpg pod inną nazwą - "obraz Jowisza.jpeg"

Kod:
Atrybuty
Atrybut Wartość Opis
shape default
rect
circle
poly
Określa kształt obszaru: cały region, prostokąt, okrąg, wielokąt. Używany razem z atrybutem coords.
coords coordinates Określa współrzędne pożądanego obszaru. Współrzędne lewego górnego rogu obrazu wynoszą 0,0.
Prostokąt: "x1, y1, x2, y2" (wierzchołki: lewy-górny i prawy-dolny),
okrąg: "x, y, r" (środek i promień),
wielokąt: "x1, y1, x2, y2, ..." (kolejne współrzędne wierzchołków)
alt text Określa alternatywny tekst dla obszaru. Wymagane, jeśli występuje atrybut href
href URL Określa cel hiperłącza dla określonego obszaru
target _blank
_parent
_self
_top
framename
Atrybut docelowy określa, gdzie otworzyć połączony dokument. Używany tylko, jeśli obecny jest atrybut href. (w nowym oknie lub karcie / w ramce nadrzędnej / w tej samej ramce / w całym oknie / w nazwanej ramce).
download filename Określa czynność po kliknięciu na hiperłącze - pobranie pliku, na który wskazuje atrybut href (href musi być ustawiony).
Wartość atrybutu (filename) będzie nową nazwą dla pobieranego pliku. Przeglądarka automatycznie wykryje prawidłowe rozszerzenie pliku i doda je do pliku (.img, .pdf, .txt, .html itp.). Jeśli wartość filename zostanie pominięta, używana jest oryginalna nazwa pliku.
hreflang language_code Określa język docelowego adresu URL w obszarze (atrybut href musi być ustawiony). Ma charakter wyłącznie doradczy. language_code to dwuliterowy kod języka.
media media query Określa, dla jakiego nośnika / urządzenia docelowy adres URL jest zoptymalizowany
type media_type Określa typ mediów internetowych (wcześniej znany jako typ MIME) docelowego adresu URL. Używany tylko wtedy, gdy ustawiony jest atrybut href. Ma charakter wyłącznie doradczy.
rel alternate, author, bookmark, help, license, next, nofollow, noreferrer, prefetch, prev, search, tag Określa związek między bieżącym dokumentem a docelowym adresem URL

przykład:
 <img src="obrazek.png" usemap="#mapa" alt="mapa klikalna">
 <map name="mapa"> 
 <area shape="circle" coords="0,25,9" alt="Wenus" href="wenus.jpg">
 <area shape="circle" coords="11,22,5" alt="Mars" href="mars_ok_77.html" 
  download="Mars">
 <area ... ...
 </map>

CSS (domyślne ustawienia)
area {
  display: none;
}
Info: