![网页设计与网站建设完全实战手册](https://wfqqreader-1252317822.image.myqcloud.com/cover/459/27110459/b_27110459.jpg)
上QQ阅读APP看书,第一时间看更新
7.4 综合实战——创建图像热点超链接网页
有时候需要在一张图片上设置几个区域,单击图片的不同区域可以进入不同的页面,或者是单击图片的某一块区域进入某一个页面,这就是网页的热点超链接,创建图像热点超链接的效果如图7-24所示,具体操作步骤如下:
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/figure_0273_0001.jpg?sign=1739547646-DqojZQAVPzEwKSz6uqKr6vhBxkX7CRPC-0-d9e08c034957357393dce600669f6f9e)
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00295.jpg?sign=1739547646-KsciDkgxc3Xz6bcKhGSsfC9w18fC0JUU-0-3829eec496af2d4289837589a4ef76a7)
图7-24 创建热点链接
01 选中要创建热点超链接的图像,如图7-25所示。
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00296.jpg?sign=1739547646-hVA2t1VPPt4NrFAWe8bcxG7qhBhzuMcW-0-fa62090131b2105ea46ea342f19c605e)
图7-25 打开网页文档
02 打开“属性”面板,在面板中选择“矩形热点工具”,如图7-26所示。
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00297.jpg?sign=1739547646-3asEHe30ua5ipgHww2psyr6dZjFxradR-0-240e3e2e25ba005044d74d700168f62c)
图7-26 选择“矩形热点工具”
03 在要绘制热点的位置按住鼠标左键拖动,以绘制矩形热点区域,如图7-27所示。
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00298.jpg?sign=1739547646-hdIscXN9ltA1BnCBZobfjxOmq3KCoKMY-0-d6b05d94774a2fa2ce4120422d1f9d9e)
图7-27 绘制矩形热点区域
04 按照步骤02的方法绘制其他的热点区域,如图7-28所示。
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00299.jpg?sign=1739547646-rGe7Xwe6yXyAjIE5MSadEe3e47cJWzpZ-0-c5263c6a951c159d9262265a4b4aa84c)
图7-28 绘制其他的热点区域
05 保存文档,按F12键,在浏览器中预览,当单击热点超链接时,效果参见图7-24所示。