网页设计与制作项目7超链接.pptVIP

* * * * 1．超链接的概念 所谓超链接就是浏览者可以通过点击设置超链接的文字、图像等网页元素来访问与其链接的页面、图像等网页元素或网站。Dreamweaver提供了多种创建链接的方法，可创建到文档、图像、多媒体文件或可下载软件的链接，可以建立到文档内任意位置的任何文本或图像的链接，包括标题、列表、表、绝对定位的元素或框架中的文本或图像。 超级链接由源端点和目标端点两部分组成，有超链接的一端为源端点（鼠标指针指向其上时光标形状为： ），跳转到的页面为目标端点。 7.3.1 超链接 7.3.1 超链接 2．超链接的类型 （1）内部链接 内部链接可以跳转到本网站内其他文档或文件，如图形、电影、PDF或者声音文件。 （2）外部链接 外部链接可以链接到不属于本网站的资源，丰富网站的内容。 （3）锚记链接 锚记链接可以跳转到本站点指定文档的位置。 （4）电子邮件链接 电子邮件链接可以启动电子邮件程序，允许用户书写电子邮件，并发送到指定地址。 7.3.1 超链接 3．路径 从一个网页到另一个网页的链接是通过每个网页的地址来完成的。每个Web页面的唯一的地址，即统一资源定位器URL。链接路径有三种类型：绝对路径、相对路径、站点根目录相对路径。 （1）绝对路径 绝对路径提供所链接文档的完整URL，而且包括所使用的协议（如对于Web页面，通常使用HTTP协议），例如http://www//support/dreamweaver/contents.html。 对于外部链接必须使用绝对路径才能链接到其他服务器上的文档。对于内部链接也可以使用绝对路径链接，但是采用绝对路径不利于站点的移植。通过对内部链接使用相对路径，能够提高文件在站点内移动时的灵活性。 7.3.1 超链接 （2）相对路径 对于大多数Web站点的本地链接来说，文档相对路径通常是最适合的路径。在当前文档与所链接的文档位于同一文件夹中，而且可能保持这种状态的情况下，文档相对路径特别有用。文档的相对路径还可用于链接到其他文件夹中的文档，方法是利用文件夹层次结构，指定从当前文档到所链接文档的路径。例如dreamweaver/contents.html。 文档的相对路径省略掉对于当前文档和所链接的文档都相同的绝对路径部分，而只提供不同的路径部分。例如，某站点的结构如图所示。 站点结构 7.3.1 超链接 （3）站点根目录相对路径 站点根目录相对路径描述从站点的根文件夹到文档的路径。如果在处理使用多个服务器的大型Web站点，或者使用承载多个站点的服务器，则可能需要使用这类型路径。 站点根目录相对路径以一个正斜杠（/）开始，该正斜杠表示站点根文件夹。例如/support/dreamweaver/contents.html。 7.3.1 超链接 4．设置文本超链接的属性 执行【修改】|【页页属性】菜单命令，或在【文件名】属性面板上单击“页面属性”按钮，在弹出的【页页属性】对话框中设置文本超链接的属性，如图所示。 设置“文本”链接属性 7.3.2 内部超链接 1．创建文本或图像超链接 创建文本或图像超链接后，单击该文本或图像便可以打开链接所指向的目标网页。创建文本与图像超链接的方法相同，下面仅以文本超链接为例，讲述文本或图像超链接的几种方法。 方法一：步骤1 在文档中选中超链接源端点的文本“欢迎您的光临”，如图所示。 教务处网站首页 7.3.2 内部超链接 步骤2 执行【插入】|【超级链接】菜单命令，或在【插入】面板中单击【常用】|【超级链接】按钮，打开【超级链接】对话框，如图所示。 【超级链接】对话框 7.3.2 内部超链接 步骤3 单击“链接”项右边的“浏览”按钮，在打开的【选择文件】对话框中选择超链接目标端点的文件：kcb.html，如图所示，单击“确定”按钮。 【选择文件】对话框 7.3.2 内部超链接 步骤4 返回【超级链接】对话框，设置其他参数，如图所示，单击“确定”按钮。 超级链接参数设置 7.3.2 内部超链接 步骤5 保存文件，单击“预览”按钮，在打开的网页中点击“欢迎您的光临”文字后，页面就会跳转到教务处网站。 方法二：在文档中选中超链接源端点的文本，在【属性】面板中的单击“链接（L）”文本框右侧的“浏览文件”按钮，也可以打开【选择文件】对话框，选择超链接目标端点的文件后，单击“确定”按钮，即可完成文本超链接。 7.3.2 内部超链接 方法三：在文档中选中超链接源端点的文本，鼠标指向【属性】面板上的“指向文件”按钮，按下左键并拖动