HTML <area> tag

May 04, 2021 HTML Reference Manual

1. HTML

2. Browser support

3. Label definition and instructions for use

4. The difference between HTML 4.01 and HTML5

5. The difference between HTML and XHTML

6. Property

7. Global properties

8. The event property

9.. Related articles

HTML

Labels can divide areas on the image that can be clicked and correspond to different actions.

Image map with clickable area:

< img src = " planets.gif " width = " 145 " height = " 126 " alt = " Planets " usemap = " #planetmap " >

< map name = " planetmap " >

< area shape = " rect " coords = " 0,0,82,126 " alt = " Sun " href = " sun.gif " >

< area shape = " circle " coords = " 90,58,3 " alt = " Mercury " href = " merglobe.gif " >

< area shape = " circle " coords = " 124,58,8 " alt = " Venus " href = " venglobe.gif " >

</ map >

Try it out . . .

Browser support

All major browsers support the label.

Label definition and instructions for use

The label defines the area inside the image map (image mapping refers to an image with a clickable area).

The elements are always nested inside the label.

Note: The usemap property in the label is associated with name in the element to create a relationship between the image and the map.

The difference between HTML 4.01 and HTML5

HTML5 provides some new properties and no longer supports some properties in HTML 4.01.

The difference between HTML and XHTML

In HTML, the label does not end the label.

In XHTML, the label must be turned off correctly.

Property

New : The new property in HTML5.

属性	值	描述
alt	text	规定区域的替代文本。如果使用 href 属性，则该属性是必需的。
coords	coordinates	规定区域的坐标。
href	URL	规定区域的目标 URL。
hreflang New	language_code	规定目标 URL 的语言。
media New	media query	规定目标 URL 是为何种媒介/设备优化的。默认：all。
nohref	value	HTML5 不支持。规定没有相关链接的区域。
rel New	alternate author bookmark help license next nofollow noreferrer prefetch prev search tag	规定当前文档与目标 URL 之间的关系。
shape	default rect circle poly	规定区域的形状。
target	_blank _parent _self _top framename	规定在何处打开目标 URL。
type New	MIME_type	规定目标 URL 的 MIME 类型。注：MIME = Multipurpose Internet Mail Extensions。

Global properties

The label supports the global properties of HTML.

The event property

The tag supports the event properties of HTML.

HTML DOM Reference Manual: Area Object