本文概述
HTML <map>标记与<area>标记一起使用以定义客户端图像映射。
图像地图由具有可单击区域的图像组成, 你可以在其中单击图像, 它将打开到新的或提供的目的地。
<map>标记可以包含多个<area>元素, 这些元素定义了区域的坐标和类型。
借助<map>标记, 你可以轻松地将图像的任何部分链接到其他文档, 而无需分割图像。
句法
<map name=" ">
以下是有关HTML <map>标记的一些规范
Display | None |
开始日期/结束日期 | Empty Tag(Only Start tag) |
Usage | Image 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.srcmini02.com/html-tutorial">
<area shape="rect" coords="199, 36, 277, 85" href="https://www.srcmini02.com/css-tutorial">
<area shape="rect" coords="330, 107, 406, 159" href="https://www.srcmini02.com/bootstrap-tutorial">
<area shape="rect" coords="199, 185, 267, 236" href="https://www.srcmini02.com/javascript-tutorial">
</map>
</body>
</html>
立即测试
属性
特定于标签的属性:
属性 | 值 | 描述 |
---|---|---|
name | mapname | 它定义了图像映射的名称。 |
全局属性:
<map>标记支持HTML中的全局属性
事件属性:
<map>标记支持HTML中的事件属性。
支持的浏览器
Element | Chrome | IE | Firefox | Opera | Safari |
<map> | Yes | Yes | Yes | Yes | Yes |