网页制作试验教程热点链接.ppt

热点链接 实验二十九 创立图片热点区域 实验三十 设置热点链接 热点指的是把一幅图像划分为几个部 分，不同的部分对应于不同的超级链接， 也可称为图像映射。这种图片热点技术扩 展了超级链接的应用形式，而 Dreamweaver 界面中的交互式热点编辑则大 大提高了热点的标注和使用效率。 实验目的： 要求同学们能够掌握创立图片热点区 域的方法。 实验原理： 客户端热点将超级链接信息保存在 HTML 文件中，而不是像服务器端的热点 链接那样保存在单独的热点文件中。 实验条件： 电脑操作系统 Windows XP/2000/98 、 Dreamweaver 8 网页设计软件。 实验二十九 创立图片热点区域 本实验以在“太阳系缩略图”中创建 “土星”图像热点为例，向同学们详细讲述 如何创立图片的热点区域。 实验内容： 步骤 1 选择［插入］菜单栏中的［常用］中的 （图像）按钮，弹出［选择图像源文件］对话框， 选择“九大行星”图像插入网页。 步骤 2 在［属性］面板调整图像大小等属性，在 ［属性］面板中的热点工具中，点击 （多边形热 点工具）。 步骤 3 选择 （多边形热点工具）后，顺着土星的 边缘一点一点用鼠标将关键点勾勒出土星的形状。 步骤 4 热点区域选定以后，热点的［属性］ 面板将代替原［属性］面板。 步骤 5 点击 （指针热点工具）按钮，可以随 意改变选定热点的各关键点的位置。 步骤 6 热点区域选定完毕，单击 F12 ，在浏 览器中预览效果，将鼠标放置在土星的位 置上，会变成手形。 实验三十 设置热点链接 本实验以“太阳系缩略图”土星图像热 点链接“太阳系介绍”网页的土星命名锚记 为例，向同学们详细讲述如何设置热点链接。 实验内容： 步骤 1 在热点［属性］面板中的［链接］输 入地址“太阳系介绍（锚记） html# 土”， 目标选择“ _blank” 。 步骤 2 链接选定完毕，单击 F12 ，在浏览器 中预览效果。