我们浏览网页时，经常看到一些图片上会出现特别的超链接，即在一张图片上有多个局部区域和不同的网页链接，比如地图链接。
这就是映射图像（Image Map），它是指一幅根据链接对象不同而被人为划分为若干指向不同链接的区域或“热点”（Hotspots）的相应图像区域，当点击设置好的“热点”时，会弹出链接的相应页面。
Dreamweaver制作映射图像----热点图像区域
现在就利用Dreamweaver CS5的图像热点功能制作一个地图链接的实例。
1. 在 Dreamweaver CS5 中新建一个HTML文件取名为 map.html，选择“插入”菜单，“图像”选项，如下图所示：
在页面中插入中国地图图像。
2. 绘制热点区域。(在dw上 &点击 &设计模式 & )单击页面上的中国地图，选择底部“属性”栏中的“矩形热点工具”在地图上绘制热点区域，如下图所示：
3. 当绘制完矩形热点区域后，或者重新选择绘制好的矩形热点区域后，图像属性面板将变成热点属性面板。在“链接”框中选择热点区域所要链接的目标网页，在“目标”框中选择“_blank”，使链接的网页在新窗口中打开，在“替换”框中填入相关的提示说明。如下图所示：
提示：在这里将“目标”设置为“_blank”表示在新的浏览器窗口中打开被链接的文档，并保持当前窗口可用。“目标”框中其他各选项的含义是：
1）“_parent”代表在链接所在的父框架集中打开链接文档；
2）“_self”代表在当前框架中打开链接文档，替换该框架中的内容；
3）“_top”代表在当前文档的最外层框架集中打开链接文档，替换所有框架中的内容。
4. 绘制其他热点区域。使用属性面板中的另外两个热点工具“圆形热点工具”和“多边形热点工具”同样可以在地图上绘制热点并设置相关的热点属性，其使用方法和“矩形热点工具”相同。
现在在地图上继续绘制其他热点区域并设置链接，最终效果下图所示：
提示：使用“多边形热点工具”时，先选择工具，在要绘制的区域点击鼠标左键，这时会弹出一个对话框，不用管它，直接点“确定”，然后继续单击鼠标左键，此时会看到在点击的区域，每多点击一次，绘制的图形就会变换一次，按此方法就可以绘制出你想要的多边形了。
5. 保存页面文件并按 F12 键进行预览。至此，本实例操作完毕。
源代码如下：
&!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
&html xmlns="http://www.w3.org/1999/xhtml"&
&meta http-equiv="Content-Type" content="text/ charset=gb2312" /&
&title&运用Dreamweaver制作地图(热点图像区域)链接的方法示例-&/title&
&p&&img src="append/.jpg" width="387" height="329" border="0" usemap="#Map" /&&/p&
&map name="Map" id="Map"&
&area shape="rect" coords="57,75,128,133" href="append/xinjiang.html" target="_blank" alt="新疆介绍" /&
&area shape="circle" coords="159,170,32" href="append/qinghai.html" target="_blank" alt="青海介绍" /&
&area shape="poly" coords="162,238,159,261,161,274,176,286,199,282,206,276,202,255,185,255,177,243,169,233,163,231,162" href="append/yunnan.html" target="_blank" alt="云南介绍" /&
&p&注：选择制作的热点区域：新疆、青海、云南，点击查看效果！&/p&
日期：207.3.20 & &赖忠标 & &记 & &
阅读(...) 评论()君，已阅读到文档的结尾了呢~~
45个DREAMWE***ER常见问题整理45涓?REAMWE***ER甯歌?????寸?1& ?—W涓??濡??杈??涓EUR涓?┖?煎?锛??EUR?EUR杈??绌烘????棰???—W浼间?宸叉?浜??涓?EUR??甯歌????棰????滑????ㄨ?澶??缁?W浣跨??归???...
扫扫二维码，随身浏览文档
手机或平板扫扫即可继续访问
45个DREAMWE***ER常见问题整理
举报该文档为侵权文档。
举报该文档含有违规或不良信息。
反馈该文档无法正常浏览。
举报该文档为重复文档。
推荐理由：
将文档分享至：
分享完整地址
文档地址：
粘贴到BBS或博客
flash地址：
支持嵌入FLASH地址的网站使用
html代码：
&embed src='/DocinViewer-4.swf' width='100%' height='600' type=application/x-shockwave-flash ALLOWFULLSCREEN='true' ALLOWSCRIPTACCESS='always'&&/embed&
450px*300px480px*400px650px*490px
支持嵌入HTML代码的网站使用
您的内容已经提交成功
您所提交的内容需要审核后才能发布，请您等待！
3秒自动关闭窗口为什么ＤＷ制作的多个热点连接只能打开一个？【dw吧】_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0成为超级会员，使用一键签到本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：346,957贴子：
为什么ＤＷ制作的多个热点连接只能打开一个？收藏
我用ＤＷ在一张图片上制作了二十多个热点连接，可当我使用时切只能打开同一个连接。并且那个连接不是我我插入的的连接。这是怎么回事，请各位高手指教。
不同路面需要不同轮胎，教你如何选择优质轮胎。
我也遇到同样问题，请问您是怎么解决的
热点下的图片是不是有链接 如果有链接就没用了吧
你设置链接啊
map 也就是地图 每一个热点的数值都要改成不一样的 比如说第一个热点是map1 第二个热点就用map2
以此类推反正不能重复.
楼主 有解决吗？求助呢~
楼主解决了吗？
登录百度帐号推荐应用