HTML area tag

From http://www.w3schools.com (Copyright Refsnes Data)

# HTML <area> tag

## Example

An image map, with clickable areas:

<img src ="planets.gif" width="145" height="126" alt="Planets" usemap ="#planetmap" />
<map id ="planetmap" 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>

Try it yourself!

## Definition and Usage

The <area> tag defines a region in an image map.

The area element is always nested inside a <map> tag.

## Browser Support

The <area> tag is supported in all major browsers.

## Differences Between HTML and XHTML

In HTML the <area> tag has no end tag.

In XHTML the <area> tag must be properly closed.

## Tips and Notes

Note: The usemap attribute in the <img> tag refers to the id or name (browser dependant) attribute in <map>, therefore we have added both the id and name attributes to <map>.

## Required Attributes

DTD indicates in which DTD the attribute is allowed. S=Strict, T=Transitional, and F=Frameset.

Attribute | Value | Description | DTD
--- | --- | --- | ---
alt | text | Specifies an alternate text for the area | STF

## Optional Attributes

Attribute | Value | Description | DTD
--- | --- | --- | ---

coords

if shape="rect" then
coords="left,top,right,bottom"

if shape="circ" then
coords="centerx,centery,radius"

if shape="poly" then
coords="x1,y1,x2,y2,..,xn,yn"

Specifies the coordinates for the clickable area

STF

href | URL | Specifies the target URL of the area | STF
nohref | true false | Excludes an area from the image map | STF

shape

rect
rectangle
circ
circle
poly
polygon

Defines the shape of the area

STF

target

_blank
_parent
_self
_top

Where to open the target URL.

- _blank - the target URL will open in a new window
- _self - the target URL will open in the same frame as it was clicked
- _parent - the target URL will open in the parent frameset
- _top - the target URL will open in the full body of the window

TF

## Standard Attributes

id, class, title, style, dir, lang, xml:lang, tabindex, accesskey

For a full description, go to Standard Attributes.

## Event Attributes

onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, onfocus, onblur

For a full description, go to Event Attributes.

From http://www.w3schools.com (Copyright Refsnes Data)