网页制作课件第4章_超链接

《网页制作课件第4章_超链接》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第4章超链接制作人：王飞重点和难点链接的检查与测试绝对路径相对路径创建超链接4.1超链接基础知识4.1.1超链接概述1.绝对路径绝对路径是指被链接对象的完整路径，是一个完整URL地址。2.根目录相对路径根目录相对路径是指从站点根文件夹到被链接对象经过的路径。站点上所有公开的文件都存放在站点的根目录下。根目录相对路径以一个正斜杠“/”开始，该正斜杠表示站点根文件夹。3．文档目录相对路径文档目录相对路径是指以当前文档所在位置为起点到被链接对象经由的路径，使用相对路径可以省去当前文档与被链接对象的绝对路径或根目录相对路径中相同的部分，保留

2、不同的部分。文档目录相对路径适合于网站的内部链接。超链接就是一种超媒体链接技术，超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序4.2典例剖析—信息导航列表本节将通过建立一个信息导航网页的实例来讲解超链接的使用。本节操作任务：（1）在“Mystuhome”下建立文件夹“超链接”，在“超链接”文件夹下建立网页“index.html”和文件夹“image”（2）在网页中创建链接。（3）在网页中创建E-mail链接。（4）在

3、网页中制作图像映射，设置图像热点的超链接。4.2.1创建内部链接1.新建网页（1）在“Mystuhome”下建立文件夹“超链接”，在“超链接”文件夹下建立文件夹“image”和网页“index.html”，保存网页文档，如图4-1所示。（2）按图4-1所示编辑网页，过程这里不在详叙。图4-1网页“index.html”演示讲解4.2.1创建内部链接2.创建内部链接为网页中的文本“我的相册”建立内部链接，操作过程如下。（1）选中要设置超接接的元素，这里是选中文本“我的相册”。（2）在属性面板的“链接”文本框中直接输入链接路径或单击“链

4、接”文本框右边的【浏览文件】按钮，在弹出的“选择文件”框中选择一个链接目标对象。这里，选择同一个文件夹下“MyAlbum.html”。也可以在属性面板中拖动“链接”文本框右侧的【指向文件】按钮到“文件”面板中相应的链接目标对象，则链接将指向该对象。拖动时会出现一条带箭头的线，指示要拖动到的位置，指向对象后只需释放鼠标，即可自动生成链接。演示讲解4.2.1创建内部链接2.创建内部链接(3)链接文本框设置完成后，属性面板中的“目标”下来列表框就自动变为可选状态，用于设置目标对象打开的窗口，共有_blank，_parent，_self，_

5、top四个选项可供选择。_blank：表示重新打开一个新的浏览器窗口显示网页。_parent：表示在本框架的上一级框架或浏览器窗口显示网页。_self：表示在自身的框架或浏览器窗口内显示，这个目标选项是默认的没有指定时就会被采用。_top：在浏览器窗口打开链接的网页。这里选择“_blank”。(4)一个内部链接创建完成，设置完成后如图所示。单击【保存】按钮，按F12按钮预览网页。演示讲解4.2.2创建外部链接为网页中的文本“我的家乡”建立外部链接，操作过程如下。（1）选中要设置超接接的元素，这里是选中文本“我的家乡”。（2）在属性面

6、板的“链接”文本框中直接输入外部链接的绝对路径，这里是http://www.chengdu.gov.cn。(3)在属性面板中的“目标”下来列表框中设置目标对象打开的窗口，这里选择“_blank”。(4)一个外部链接创建完成，单节【保存】按钮，按F12按钮预览网页。4.2.3创建E-mail链接为方便获取网页用户的意见和建议，通常需要在网页中建立E-mail链接。E-mail链接被点击后会调用系统中设置的默认邮件程序，打开一个邮件发送窗口，用户可以直接点击E-mail链接发送邮件。为网页中文本“我的邮箱”建立E-mail链接，操作过程

7、如下。（1）选中要设置超接接的元素，这里是选中文本“我的邮箱”。（2）在DreamweaverCS4主窗口中，单击菜单【插入】→【电子邮件链接】弹出如图4-3所示的电子邮件链接对话框。图4-3电子邮件链接对话框演示讲解4.2.3创建E-mail链接(3)对话框中“文本”指在网页上显示的文本，“E-mail”指需要链接到的邮箱地址，这里输入“wysj@126.com”，单击【确定】按钮完成E-mail链接的设置。也可以在属性面板的“链接”文本框中输入“mailto:”和邮箱地址，这里是“mailto:wysj@126.com”。(4)

8、一个E-mail链接创建完成，单击【保存】按钮，按F12按钮预览网页。4.2.4创建图像热区链接使用图像热区链接是创建复杂的图像交互的好方法，当用户穿件一个图像热区时可以对图像中的一个部分分别创建链接，他将告诉浏览器图像的这些部分应该