电子商务网站开发 第六讲：超级链接 上海财经大学信息管理与工程学院.

Presentation on theme: "电子商务网站开发 第六讲：超级链接 上海财经大学信息管理与工程学院."— Presentation transcript:

1 电子商务网站开发 第六讲：超级链接 上海财经大学信息管理与工程学院

2 本讲内容 什么是超级链接？ 建立与管理超级链接 实例

3 6.1 超级链接 基本概念 超链接源：决定了超级链接在页面上的显示方式
从一个网页指向另一个目的端的连接，目的端可以是另一个网页、一个文件、也可以是一个电子邮件地址、一幅图片、一段声音或是一段程序，还可是相同网页上的不同位置。 实例 超链接源：决定了超级链接在页面上的显示方式 文字、图像、热点 超链接目的端：决定了访问者在单击超级链接时Web浏览器将跳转到的位置。 内部链接 外部链接 锚链接 链接

4 相对路径和绝对路径 绝对路径 与根目录相对的路径 与文档相对的路径 如图 包含服务器协议的完全路径。
如： 与根目录相对的路径 指从当前站点的根文件夹开始的路径，这种路径与超链接源的位置无关。 /byzy.htm 与文档相对的路径 指与包含超链接源的页面文档所在的文件夹相对的路径，这种路径适用于超链接源的超链接目的端位于同一站点的情形。 ../index.htm jymarket/jyMarket1.htm 如图

5 6.2 建立超链接 内部链接 外部链接 链接 锚链接 下载链接 轮替图像及其链接（*） 导航栏（*） 图像热区与链接

6 内部链接 内部链接是同一网站内不同页面间相互联系的纽带，单击一网页的超链接源，将在浏览器上出现另一网页 建立超文本 设置超文本属性
建立超链接

7 外部链接 外部链接的目的端为本站点以外的目标，利用这种链接，可以跳转到其他的网站。加入外部链接的步骤如下：
打开超链接源所在的文件，选择要建立超链接的对象； 在“属性”面板“链接”文本框中输入链接目的端的网址，如 在”目标“下拉列表框中选择自己需要的打开方式； 按F12查看链接的效果。

8 链接 浏览者在单击链接之后，就可以自动启动浏览器默认的 处理程序，而 超链接中的地址会自动出现在该处理程序的收件人邮件地址栏中。 选中文字 或者：直接在属性面板的“链接”文本框中输入mailto:和相应的电子邮件地址以建立 链接

9 建立锚链接 创建锚点 链接到锚点 URL中也可以包含对锚的引用 打开要插入锚点的页面文档，将插入点移至要插入锚点的位置处
单击“插入”面板“常用”选项卡上的“命名锚记”图标，或单击“插入”菜单的“命名锚记”命令，出现“命名锚记”对话框。 在该对话框中输入锚点的名称（如market），单击“确定”按钮，即可以插入点处出现一个代表锚点的图标，单击该图标可以在“属性”面板上对该锚点的名称进行修改。 链接到锚点 选中用于链接源的文本（或其他元素） 在“属性”面板的“链接”属性里填入“#锚点1”（如#market），即可建立指向锚点1的超级链接 URL中也可以包含对锚的引用 如：

10 为下载文件添加超级链接 打开要加入链接的页面文档 选中要加入链接的文字 单击指向文件图标，按住鼠标不放，拖动鼠标指向站点窗口中的下载文件处

11 导航栏 (*) 导航栏是由一系列显示为按钮的图像组成的，单击导航栏上的图像按钮可以链接到站点中其他的页面。 打开页面文档
单击插入菜单的“交互式图像”/“导航条”命令，出现“插入导航栏”对话框 完成设置单击确定

12 为图像热区建立链接 选中某一图像 利用矩形热点工具（或椭圆形热点工具、多边形热点工具）在图像上绘制出一个封闭的区域。
选中该区域，在属性面板的链接属性中填入页面文档的URL 示例

13 3 超级链接的管理 基本概念 设置链接管理属性的方法
在设计网页时，有时会移动或重命名一些网页，这时指向这些网页的链接就有可能会失效。利用DW的链接管理功能，可以自动更新相应的链接，避免无效链接的产生。 设置链接管理属性的方法 单击“编辑”菜单的“参数选择”命令，出现“参数选择”对话框。 在“参数选择”对话框的“分类”列表中选择“常规”选项，在对话框右侧的“移动文件时更新链接”下拉列表中有如下三个选项 总是 从不 提示 单击“参数选择”对话框的“确定”按钮，完成设置操作。

14 利用站点地图管理链接 概念 显示站点地图 删除链接 创建链接 改变链接
站点地图是对站点中文档链接的图形化表示。利用站点地图可以创建、改变和删除链接。 显示站点地图 单击站点面板上的“展开/折叠“图标 在随后出现的站点窗口的“站点地图”图标右下方的小黑三角形上单击，在菜单中选择“地图和文件”命令，即可在站点窗口中同时显示站点地图和站点的本地文件结构。 删除链接 选中要删除链接中的目的端页面文档，然后单击“站点”菜单中的“移除链接”命令，或直接按Delete键，便可将链接删除。 创建链接 先单击链接源页面文档，在该文档的右上角出现指向文件图标（target图标），拖动该图标，使之指向链接的目的端文档。 改变链接 只要选中链接中的目的端文档，然后单击“站点”菜单中的“改变链接”命令，在随后出现的“选择HTML文件“对话框中重新选择一个其他的目的端文档即可。

15 改变站点范围的链接 改变站点范围的链接是指将整个站点中指向某个文档的链接全部改为指向另一个文档的链接 方法
单击“站点”菜单中的“改变站点范围的链接”命令，出现“更改整个站点链接”对话框 在该对话框中的“将所有链接更改为”文本框中输入要更改的链接的路径和文件名，在“新链接”文本框中输入更改后的新链接的路径和文件名。 单击确定按钮，系统便开始在整个站点范围内搜索包含要更改链接的文档，搜索完毕后会出现“更新文件”对话框，提示用户是否更新该文档中的链接。此时单击“更新”按钮，表示更新链接，而单击“不更新”按钮，表示不更新链接。

16 检查页面内的链接 方法一 方法二 预览页面，然后逐个点击，以检查链接是否有效。
选择“文件”菜单的“检查页”/“检查链接”命令，在“链接检查器”面板中就会显示检查的结果。 单击“链接检查器”面板“显示”下拉列表中的“断掉的链接”项可以列出页面内已断开的那些链接，即所没路径不再有效或指向不存在文件的链接；而单击“外部链接”项可以列出页面上所有的外部链接。 若要保存检查的结果，可以单击“链接检查器”面板中的“保存报告”图标。

17 检查本地站点中的链接 若要检查站点内某个或某些文件夹内的链接是否有效，方法如下：
在“站点”面板的“本地视图”中，选择要检查的文件或文件夹 右击鼠标，从快捷菜单中选择“检查链接”/“选择文件/文件夹”命令，“链接检查器”面板中将显示检查结果 若要保存检查结果，可以单击“链接检查器”面板中的“保存报告”图标。 若要检查整个站点中的链接是否有效或是否存在孤立的页面，其方法如下： 在“站点”面板中选择一站点 选择“站点”/“检查站点范围的链接”命令，“链接检查器”面板中显示检查结果。如果在该结果的“显示”下拉列表框中选择“孤立文件”，便可显示站点中所有的孤立文件。 结束

18 返回

19 http://www.fudan.edu.cn/ www.shufe.edu.cn www.fudan.edu.cn / gzxi yxsz
复旦大学 / gzxi yxsz Index.htm gzxi.htm yxsz.htm 与根目录相对的路径：/yxsz/yxsz.htm 与文档相对的路径：../yxsz.htm/yxsz.htm 返回

20 热区 热区所指向的链接地址 返回

21 返回

22 展开/折叠图标 返回

23 返回

24 按不同类型的错误来显示检查结果 保存报告 返回