5.6.6　设置图像的映射图

对图像设置多于一个的映射图。代码如下所示。

＜！—下面一行表示对图像设置映射图—＞

01 ＜img src="html.jpg"usemap="#face"＞

02 ＜map name="Face"＞

03 ＜area shape="rect"href="page.html"coords="140，20，280，60"＞

04 ＜area shape="poly"href="image.html"coords="100，100，180，80，200，140"＞

05 ＜area shape="circle"href="new.html"coords="80，100，60"＞

06 ＜/map＞

【代码解析】在＜body＞＜/body＞标记对中加上以上代码第2～6行，表示在图像html.jpg中设置映射图，其中有3个热点区域，即coords中坐标范围所表示的区域，同时这些区域中都设置了超链接，分别链接到不同的页面，在图5.15中，当鼠标指针放在图像上面时，在热点区域会出现手形状态，表示可链接到其他页面。

图　5.15　映射图

技巧　热点区域可以用Dreamweaver CS5画出来，即选择图像后，在下面属性栏中的左边有圆形、多边形和四边形的按钮，单击其中一个后，在图像上可以画出对应的区域来，在后面的链接中设置目标地址即可设置映射图，免去了检测图像的位置。