(Dreamwaver+CS4课件)第9章 超链接.pptVIP

第9章 超链接 在这一章我们引入一个新的概念——超链接（Hyperlink）。在网页设计中，超链接的应用非常广泛，熟练地应用超链接是设计网页的基本要求。本章主要讲解的内容是超链接的基本知识，各种超链接的操作方法，以及检查和修复网页中的超链接。 9.1 超链接概述 超链接是Web页中最吸引人的部分。Internet之所以如此受到人们的欢迎，很大程度上是由于在网页中使用了大量的超级链接。在介绍使用Dreamweaver CS4在文档中创建超链接之前，我们先来了解一些关于超链接的基本概念和基本知识。 9.1.1 超链接的基本概念 超链接是指从一个对象指向另一个对象的指针，它可以是网页中的一段文字也可以是一张图片，甚至可以是图片中的某一部分。它允许我们同其它网页、站点、图片、文件等进行连接，从而使Internet上的信息构成一个有机的整体。 根据链接方式的不同超链接可分为：绝对路径连接、相对路径连接两种。而根据链接对象的不同超链接又可分为：超文本链接、命名锚链接、图像链接、电子邮件链接、热区链接，空链接等。 9.1.2 超链接的路径 相对路径与绝对路径作为超链接的两种基本连接方式是十分重要的也是容易混淆的，要想熟练运用超链接我们首先就的弄清什么相对路径什么是绝对路径，它们的区别在哪里。 1．绝对路径 绝对路径：指明目标端点所在具体位置的完整URL地址的链接路径。 2．相对路径 相对路径：指明目标端点与源端点之间相对位置关系的路径称为相对路径。 9.2 超文本链接 超文本链接是最普通、最简单的一种超链接。在Dreamweaver 中根据链接目标的不同，超文本链接可以分为与本地网页文档的链接、与外部网页的链接、空链接等几种类型。下面将逐一介绍。 9.2.1 创建与文档的链接 与本地网页文档的链接，是最常见的超文本链接类型。通过创建与文档的链接，可以将本地站点的一个个单独的文档连接起来，形成网站。具体操作步骤如下： 9.2.2 创建与外部网页的链接 上一小节介绍了创建与本地文档的链接，下面就来学习如何创建与外部网页的链接。具体操作步骤如下： （1）选中要创建链接的文本“北京师范大学”；在“属性检查器”的“链接”文本框中直接输入URL地址“”，“目标”下拉列表框中选择“_blank”，如图9.5所示。 （2）保存文件，在浏览器中预览时，单击文本“北京师范大学”，就会在新窗口中打开北京师范大学网站的主页。 9.2.3 创建空链接 空链接是指未指定目标文档的链接。使用空链接可以为页面上的对象或文本附加行为。具体操作步骤如下： （1）选中要创建链接的文本“更多进入”；在“属性检查器”，“链接”文本框中直接输入 “#”，如图9.6所示。 （2）保存文件，在浏览器中预览时，“更多进入”显示为超文本链接的样式，单击后不会跳转到别的页面，如图9.7所示。 9.3 命名锚链接 当用户浏览一个内容较多的网页时，查找信息会浪费大量的时间。在这种情况下，可以在网页中创建锚链接，放在页面顶部作为书签。锚实质上就是在文件中命名的位置或文本范围，锚链接起到的作用就是在文档中定位。单击锚链接，就会跳转到页面中指定的位置。 9.3.1 创建锚点 在创建锚链接之前，首先要在页面中创建锚点。具体操作步骤如下： 9.3.2 建立锚链接 在上一小节中创建了四个锚点，下面来学习为文本建立锚链接。具体步骤如下： 9.4 电子邮件链接 电子邮件链接是一种特殊的链接，在网页中单击这种链接，不是跳转到其他网页中，而是会自动启动电脑中的Outlook Express或其他E-mail程序，允许书写电子邮件，并发送到指定的地址。具体操作步骤如下： 9.5 图像热区链接 在Dreamweaver CS4中，除了可以给文本添加超链接，还可以给图像添加超链接。图像的超链接包括为整张图像创建超链接和在图像上创建热区两种方式。 9.5.1 为整张图像创建超链接 这种应用方式很普遍，在网页中经常会用到。当鼠标移到设置了链接的图像上时，会变成“手型”；单击图像，会跳转到指定的页面。具体操作步骤如下： 9.5.2 创建热区 在Dreamweaver CS4中，除了为整张图像创建超链接外，还可以在一张图像上创建多个链接区域，这些区域可以是矩形、圆形或者多变形。这些链接区域就叫做热区。当单击图像上的热区时，就会跳转到热区所链接的页面上。具体操作步骤如下： 9.6 导航条 导航条是由一个图像或一组图像组成，单击某个图像，就会跳转到相应的栏目页面。Dreamweaver CS4中的导航条功能，可以设置随着鼠标的不同操作，如滑过、按下等，图像的显示内容也会随之变化，效果如图9.25所示。具体操作步骤如下： 9.7 检查与修复链接 对于一个内容繁多的网站来说，通常包含有大量的超链接。使用D