HTML <map> 标签与 <area> 标签一起使用来定义客户端图像映射。
图像地图由具有可点击区域的图像组成,您可以在其中单击图像,它将打开到新的或提供的目的地。
<map> 标签可以由多个 <area> 元素组成,这些元素定义了区域的坐标和类型。
借助 <map> 标签,您可以轻松地将图像的任何部分链接到其他文档,而无需分割图像。
<map name=" ">
以下是关于 HTML <map> 标签的一些规范
| 展示 | 没有任何 |
| 开始标签/结束标签 | 空标签(仅开始标签) |
| 用法 | 影像地图 |
<!DOCTYPE html>
<html>
<head>
<title>HTML map tag</title>
<style>
body{
margin-left: 250px;}
</style>
</head>
<body>
<h2>Example of HTML Map tag</h2>
<img src="image1.png" usemap="#web">
<map name="web">
<area shape="rect" coords="66,117,131,168" href="https://www.rocschool.com/tutorial/html-tutorial">
<area shape="rect" coords="199,36,277,85" href="https://www.rocschool.com/tutorial/css-tutorial">
<area shape="rect" coords="330,107,406,159" href="https://www.rocschool.com/tutorial/bootstrap-tutorial">
<area shape="rect" coords="199,185,267,236" href="https://www.rocschool.com/tutorial/javascript-tutorial">
</map>
</body>
</html>| 属性 | 属性值 | 描述 |
|---|---|---|
| name | mapname | 它定义了图像映射的名称。 |
<map> 标签支持 HTML 中的全局属性
<map> 标签支持 HTML 中的事件属性。
| 元素 | Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| <map> | Yes | Yes | Yes | Yes | Yes |