本文概述
- 属性
- 支持的浏览器
图像地图由具有可单击区域的图像组成, 你可以在其中单击图像, 它将打开到新的或提供的目的地。
< 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="http://www.srcmini.com/image1.png" usemap="#web">
<
map name="web">
<
area shape="rect" coords="66, 117, 131, 168" href="https://www.srcmini.com/html-tutorial">
<
area shape="rect" coords="199, 36, 277, 85" href="https://www.srcmini.com/css-tutorial">
<
area shape="rect" coords="330, 107, 406, 159" href="https://www.srcmini.com/bootstrap-tutorial">
<
area shape="rect" coords="199, 185, 267, 236" href="https://www.srcmini.com/javascript-tutorial">
<
/map>
<
/body>
<
/html>
立即测试
属性特定于标签的属性：
| 属性 | 值 | 描述 |
|---|---|---|
| name | mapname | 它定义了图像映射的名称。 |
< map> 标记支持HTML中的全局属性
事件属性：
【HTML map标签】< map> 标记支持HTML中的事件属性。
支持的浏览器
| Element | Chrome | IE | Firefox | Opera | Safari |
| < map> | Yes | Yes | Yes | Yes | Yes |
