![网页设计与网站建设完全实战手册](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=1739689555-Nz3WLzG2AGnX1msmSfbZtraWXyNaocoX-0-0631e28cd1a57e5b3427d5bb397626f2)
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00295.jpg?sign=1739689555-aPAL0KQM2yZ0BWysiQ5GE3FxiGcmjF2E-0-e268c03b1981b88d840c297e14a353d3)
图7-24 创建热点链接
01 选中要创建热点超链接的图像,如图7-25所示。
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00296.jpg?sign=1739689555-X5Wu60fNRtjyVlb2NDRQrDpqz4X6gVm1-0-95b16f61f45f96ea0c951bcfb4eb416e)
图7-25 打开网页文档
02 打开“属性”面板,在面板中选择“矩形热点工具”,如图7-26所示。
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00297.jpg?sign=1739689555-8EGCnPZuOPEKOPSfkAB6XMDu7q17loWn-0-2ef1d50c2a08368f5d63ce37be406c19)
图7-26 选择“矩形热点工具”
03 在要绘制热点的位置按住鼠标左键拖动,以绘制矩形热点区域,如图7-27所示。
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00298.jpg?sign=1739689555-SxnVUiDO15VUkanuwQIkgfXGo1cbm7Sl-0-e8f3125bd0f3f320c5f9e941ecca7c4d)
图7-27 绘制矩形热点区域
04 按照步骤02的方法绘制其他的热点区域,如图7-28所示。
![](https://epubservercos.yuewen.com/163668/15477638404524106/epubprivate/OEBPS/Images/00299.jpg?sign=1739689555-s9HG0wIwHUrxSy92PLixnTWSDRHX5wB6-0-b08c6ac6ebd7fb7389d3a2b94b051fb8)
图7-28 绘制其他的热点区域
05 保存文档,按F12键,在浏览器中预览,当单击热点超链接时,效果参见图7-24所示。