HTML <area> Tag

Definitie en gebruik

<area> tags definiëren het gebied van de afbeeldingskaart (een afbeeldingskaart is een afbeelding met klikbare gebieden, ook bekend als een clientse partition responsafbeelding).

<area> elementen zijn altijd genest in <map> tagbinnen.

Let op:<img> in usemap eigenschap en <map> element van Name eigenschapGeassocieerd, maak een koppeling tussen de afbeelding en de kaart.

Zie ook:

HTML DOM referentiehandleiding:Area object

Voorbeeld

Voorbeeld 1

Een afbeelding met een klikbare gebiedsafbeelding:

<img src="life.png" alt="Life" usemap="#lifemap" width="650" height="451">
<map name="lifemap">
  <area shape="rect" coords="10,208,155,338" alt="AirPods" href="airpods.html">
  <area shape="rect" coords="214,65,364,365" alt="iPhone" href="iphone.html">
  <area shape="circle" coords="570,291,75" alt="Coffee" href="coffee.html">

Voorbeeld 2

Een afbeelding met een klikbare gebiedsafbeelding:

<img src="solarsystem.png" width="1024" height="576" alt="Planets" usemap="#planetmap">

Specifies the alternative text of the area. It is required if the href attribute exists.
Specifies the coordinates of the area.
Specifies that the target will be downloaded when the user clicks on the hyperlink.
Specifies the hyperlink target of the area.
Specifies the language of the target URL.
Specifies the media/device optimized for the target URL.
Specifies the reference information to be sent with the link.
Specifies the relationship between the current document and the target URL.
shape
  • default
  • rect
  • circle
  • poly
 Specifies the shape of the area.
target
  • Frame name
 Specifies where to open the target URL.
type Media type Specifies the media type of the target URL.

Global attributes

<area> Tags also support Global attributes in HTML.

Event attributes

<area> Tags also support Event attributes in HTML.

Default CSS settings

Most browsers will display the following default values <area> Element:

area {
  display: none;
{}

Browser support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support