HTML <area> 元素 在图片上定义一个热点区域


This element includes the global attributes.

accesskey HTML 4 only, 已废弃 Gecko 5.0
Specifies a keyboard navigation accelerator for the element. Pressing ALT or a similar key in association with the specified character selects the form control correlated with that key sequence. Page designers are forewarned to avoid key sequences already bound to browsers. This attribute is global since HTML5.
在未显示图像的浏览器上显示代替的文本字符串。这个文本应该能传达给用户与显示图像而没有文本的情况下同等的选择(译者注:就是字和图片表达一个意思)。在HTML4中, 这个属性时必需的, 但是可以是一个空的串("")。在HTML5中, 这个属性只有在href 属性被使用的时候才是必需的。
给热点区域设定具体的坐标值。这个值的数值和意义取决于这个值所描述的形状属性.。对于矩形或长方形, 这个coords 值为两个X,Y对:左上、右下。 对于圆形, 这个值是 x,y,r ,这里的 x,y 是一对确定圆的中心的坐标而 r 则表示的是半径值.。对于多边和多边形,这个值是用x,y对表示的多边形的每一个点:x1,y1,x2,y2,x3,y3,等等。In HTML4, the values are numbers of pixels or percentages, if a percent sign (%) is appended; in HTML5, the values are numbers of CSS pixels.
download HTML5
这个属性如果存在的话, 表明作者想把超链接用于下载一个资源。请查看<a> 获得关于 download属性的完整描述。
The hyperlink target for the area. Its value is a valid URL. In HTML4, either this attribute or the nohref attribute must be present in the element. In HTML5, this attribute may be omitted; if so, the area element does not represent a hyperlink.
hreflang HTML5
Indicates the language of the linked resource. Allowed values are determined by BCP47. Use this attribute only if the href attribute is present.
name HTML 4 only, 已废弃 Gecko 5.0
Define a names for the clickable area so that it can be scripted by older browsers.
media HTML5
A hint of the media for which the linked resource was designed, for example print and screen. If omitted, it defaults to all. Use this attribute only if the href attribute is present.
nohref HTML 4 only, 已废弃 Gecko 5.0
Indicates that no hyperlink exists for the associated area. Either this attribute or the href attribute must be present in the element.

Usage note: This attribute is obsolete in HTML5, instead omitting the href attribute is sufficient.

rel HTML5
For anchors containing the href attribute, this attribute specifies the relationship of the target object to the link object. The value is a comma-separated list of link types values. The values and their semantics will be registered by some authority that might have meaning to the document author. The default relationship, if no other is given, is void. Use this attribute only if the href attribute is present.
The shape of the associated hot spot. The specifications for HTML 5 and HTML 4 define the values rect, which defines a rectangular region; circle, which defines a circular region; poly, which defines a polygon; and default, which indicates the entire region beyond any defined shapes. Many browsers, notably Internet Explorer 4 and higher, support circ, polygon, and rectangle as valid values for shape; these values are .
tabindex HTML 4 only, 已废弃 Gecko 5.0
A numeric value specifying the position of the defined area in the browser tabbing order. This attribute is global in HTML5.
This attribute specifies where to display the linked resource. In HTML4, this is the name of, or a keyword for, a frame. In HTML5, it is a name of, or keyword for, a browsing context (for example, tab, window, or inline frame). The following keywords have special meanings:
  • _self: Load the response into the same HTML4 frame (or HTML5 browsing context) as the current one. This value is the default if the attribute is not specified.
  • _blank: Load the response into a new unnamed HTML4 window or HTML5 browsing context.
  • _parent: Load the response into the HTML4 frameset parent of the current frame or HTML5 parent browsing context of the current one. If there is no parent, this option behaves the same way as _self.
  • _top: In HTML4: Load the response into the full, original window, canceling all other frames. In HTML5: Load the response into the top-level browsing context (that is, the browsing context that is an ancestor of the current one, and has no parent). If there is no parent, this option behaves the same way as _self.
Use this attribute only if the href attribute is present.
This attribute specifies the media type in the form of a MIME type for the link target. Generally, this is provided strictly as advisory information; however, in the future a browser might add a small icon for multimedia types. For example, a browser might add a small speaker icon when type is set to audio/wav. For a complete list of recognized MIME types, see http://www.w3.org/TR/html4/references.html#ref-MIMETYPES. Use this attribute only if the href attribute is present.


<map name="primary">
  <area shape="circle" coords="200,250,25" href="another.htm" />
  <area shape="default" nohref />


Specification Status Comment
HTML Living Standard
Living Standard  
HTML 4.01 Specification


Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support (Yes) (Yes) (Yes) (Yes) (Yes)
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mini Opera Mobile Safari Mobile
Basic support ? ? ? ? ? ?


Under the HTML 3.2, 4.0, and 5 specifications, the closing tag </area> is forbidden.

The XHTML 1.0 specification requires a trailing slash: <area />.

The id, class, and style attributes have the same meaning as the core attributes defined in the HTML 4 specification, but only Netscape and Microsoft define them.

Netscape 1–level browsers do not understand the target attribute as it relates to frames.

HTML 3.2 defines only alt, coords, href, nohref, and shape.