area – image-map hyperlink ⓘ # T
The area element represents either a hyperlink with some text and a corresponding area on an image map, or a dead area on an image map.
Permitted content #
empty (void element)
Permitted attributes #
Descriptions for attributes specific to this element #
- alt = normal character data
- The fallback content for the image map.
- href = URI
- A URL that provides the destination of the hyperlink for this area.
- target = browsing-context name or keyword
- A name or keyword giving a browsing context for UAs to use when following the hyperlink for this area.
- rel = tokens NEW
- A list of tokens that specify the relationship between the document containing the area and the destination indicated by the area.
- media = media-query list NEW
- The media for which the destination of the hyperlink was designed.
- hreflang = language tag NEW
- The language of the destination of the hyperlink.
- type = MIME type
- The MIME type of the destination of the hyperlink.
- shape = "rect" & coords = rectangle
- Specifies that the shape of the area of this hyperlink on the image map is a rectangle.
- shape = "circle" & coords = circle
- Specifies that the shape of the area of this hyperlink on the image map is a circle.
- shape = "poly" & coords = polygon
- Specifies that the shape of the area of this hyperlink on the image map is a polygon.
- shape = "default"
- Specifies that the shape of the area of this hyperlink on the image map is a rectangle that exactly covers the entire image.
Additional constraints and admonitions #
- The area element must have an ancestor map element.
- The nohref attribute on the area element is obsolete. Omitting the href attribute is sufficient.
Tag omission #
The area element is a void element. An area element must have a start tag but must not have an end tag.Permitted parent elements #
any element that can contain phrasing elements
DOM interface #
interface HTMLAreaElement : HTMLElement { attribute DOMString alt; attribute DOMString coords; attribute DOMString shape; stringifier attribute DOMString href; attribute DOMString target; attribute DOMString rel; readonly attribute DOMTokenList relList; attribute DOMString media; attribute DOMString hreflang; attribute DOMString type; // URL decomposition IDL attributes attribute DOMString protocol; attribute DOMString host; attribute DOMString hostname; attribute DOMString port; attribute DOMString pathname; attribute DOMString search; attribute DOMString hash; };
Typical default display properties #
area {
display: none; }
The name attribute is required in the map element. This attribute is associated with the <img>'s usemap attribute and creates a relationship between the image and the map.
The map element contains a number of area elements, that defines the clickable areas in the image map.
Tips and Notes
Note: The area element is always nested inside the map element. The area element defines the regions in the image map.
Definition and Usage
The <map> tag is used to define a client-side image-map. An image-map is an image with clickable areas.The name attribute is required in the map element. This attribute is associated with the <img>'s usemap attribute and creates a relationship between the image and the map.
The map element contains a number of area elements, that defines the clickable areas in the image map.
Tips and Notes
Note: The area element is always nested inside the map element. The area element defines the regions in the image map.
Attributes
| Attribute | Value | Description |
|---|---|---|
| name | unique name | Defines a unique name for the map tag, so it can be referred to. |
