介绍
我们中的许多人总是试图用JavaScripts，Java Applets，Flash Player，令人惊叹的图形等给我们的访问者留下深刻的印象，但我们一直忘记好的旧HTML也可以给访问者留下深刻的印象......只需要一些帮助。在本教程中，我将解释图像映射的工作原理，它们的创建方式以及它们的用途。
对于外行人来说，图像地图是一个具有多个“可点击”区域的图像。例如：
-图片
首先，您需要一个合适的图形。选择正确的图像时需要小心一点。不能在不同部分划分的图像不是您的最佳选择，但具有明确截止或线条的图像会更好。当然，这不适用于导航菜单或类似的东西，只适用于动物，物体或人等日常照片。
-协调
当您选择或创建所需图像时，然后将其插入图像编辑器（我使用Ms Paint），以便您可以找到它的坐标。尝试写下不同的坐标，逐个接受它们，然后将它们插入到您的文档中。根据您想要使用的“热点”，您需要不同的坐标。热点将在下一段中介绍。
-热点
既然您已经获得了图像和坐标，那么HTML就可以完成您的工作。有三种不同的形状（通常称为“热点”）可用于图像映射。它们如下：
-RECT
-CIRCLE
-POLYGON
-Rect
矩形显然是矩形的缩写。对于这个，你需要两个不同的坐标。右上角和左下角。
-圈
许多人对这一点感到困惑，许多人甚至不知道它存在。我个人认为这是最简单的。你需要的只是中心坐标（形状中心的点）和它的半径大小（记住你的数学：半径是直径的半径。不要让直径和半径混合！）。
- 多边形
最常用的热点。当您不能同时使用上述热点时，可以使用此功能。这个按顺序使用点的坐标。因此，如果您要使用五边形（五边形），那么您列出所有五个坐标，但要确保它们在ORDER中列出。一个接一个，否则你会混淆一些浏览器。
- 地图名称
就像任何人，文档，图像和国家一样，图像映射也需要名称。这只是因为如果您要在页面上包含多个地图，那么要确定哪个地图与哪个地图相关，您需要为地图命名。困惑？看这里：
<IMG SRC =“cats.gif”USEMAP =“＃kitties”><IMG SRC =“dogs.gif”USEMAP =“＃puppies”><map name =“kitties”>[....我将在稍后向您展示的地图代码....]</地图><map name =“puppies”>[......]</地图>
现在，如果您没有为每张地图命名，浏览器将如何知道哪张图片与哪张地图相符？
您还会在每张地图的末尾注意到这个标记：</ map>。您现在可能已经怀疑</ map>只是关闭了地图。简单！
- 区域和锚点标签
在完成图像映射之前，您应该知道另外两个标记。<area shape =“rect”>是一个标识，用于标识正在使用的热点。另一个是锚标记，我相信你已经知道它意味着什么。它只是<href =“http://www.YourLink.com>。所以在完整的代码中，它们应该都是这样的：
<area shape =“circle”coords =“245,30”href =“http://www.YourLink.com”>
- 最终代码
现在你只需将所有这些代码放在一起就可以了！以下是您的最终代码应如下所示：
<BODY><img src =“trees.gif”usemap =“＃green”border =“0”><map name =“green”><area shape =“polygon”coords =“19,44,45,11,87,37,82,76,49,98”href =“http://www.trees.com/save.html”><area shape =“rect”coords =“128,132,241,179”href =“http://www.trees.com/furniture.html”><area shape =“circle”coords =“68,211,35”href =“http://www.trees.com/plantations.html”></地图></ BODY>
- 其他提示
当然，您不必只使用外部链接。您还可以在页面[href =“＃SectionTwo”]，mailto [href =“mailto：[email protected]]和其他锚标签上使用书签。您也可以指定目标（在锚标记）[target =“_ new”]。插入替代文本标签 - alt（也可以在锚之后插入）[alt =“点击此处了解树木”]。