通过本章学习，应该掌握以下内容：
1,认识超链接
2,利用 Dreamweaver MX创建各种超连接的方法
3,利用 Dreamweaver MX编辑各种超连接的方法
4,利用 HTML创建,编辑超链接的方法
5,利用站点地图管理超链接的方法第 6章 在网页中使用超链接
6.1 利用 Dreamweaver MX处理超链接
6.1.1 超链接简介
1,什么是超链接所谓的超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序 。 而在一个网页中用来超链接的对象,可以是一段文本或者是一个图片 。 当浏览者单击已经链接的文字或图片后,链接目标将显示在浏览器上,并且根据目标的类型来打开或运行 。
按照链接路径的不同,网页中超链接一般分为以下 3种类型：
内部链接：即在同一个站点内的不同页面之间相互联系的超链接 。
锚点链接：可以链接到网页中某个特定位置的链接 。
外部链接：把网页与 Internet中的目标相联系的链接 。
如果按照使用对象的不同,网页中的链接又可以分为：文本超链接,图像超链接,E-mail链接,锚点链接,多媒体文件链接,空链接等合理安排超链接在网页的制作中是非常重要的 。
采用什么结构的链接会直接影响到网页的布局 。 建议,
避免孤立文件的存在
在网页中避免使用过多的超链接
网页中的超链接不要超过 4层
页面较长时可以使用书签
设置主页或上一层的链接
2,合理安排超链接
3,文档路径类型在一个网站中,有绝对路径,和根目录相对路径以及和文档相对路径 3种类型的文档路径 。
绝对路径：是包含服务器协议 （ 对于网页来说通常是 http://或 ftp://） 的完全路径 。
和根目录相对的路径：是从当前站点的根目录开始的路径 。 站点上所有可公开的文件都存放在站点的根目录下 。
和文档相对的路径：是指和当前文档所在的文件夹相对的路径 。
6.1.2 创建文本超链接
1,建立文本超链接在浏览网页时,鼠标指针经过某些文本时,指针的形状发生变化,同时文本也会发生变化 （ 如出现下划线,文本的颜色发生变化,字体发生变化等 ）,提示这是带链接的文本 。 此时点击鼠标,就会打开所链接的网页,这就是文本超链接 。
在 Dreamweaver MX中创建文本超链接的步骤为：
（ 1） 在网页上选择需要添加超链接的文本,打开文本的属性面板 。
（ 2） 在属性面板上指定文字的链接目标 。
（ 3） 在,目标,下拉列表框中选择目标文件打开的方式 。
设置结束后,在网页中被选择的文字改变了颜色,
且在文字底部出现一条下划线,即文字的超链接设置完成 。 在键盘上按,F12”键,即可将网页在浏览器中打开 。 单击链接的文字,即可打开目标文件 。
2,编辑文本超链接
（ 1） 设置文本链接的状态一个未被访问过的链接与一个被激活的链接在形式上肯定会有所区别,链接被访问过了也会发生变化,提示用户这是一个已经点击过 的链接,
所有这些都是链接的状态 。 通过设置不同的文本颜色可以使各个状态区别开来 。
（ 2） 删除文本超链接在 Dreamweaver MX中要删除一个文本超链接很容易,先用鼠标选定文本对象,将光标定位于属性面板的,链接,文本框中,用,BackSpace”
键或,Delete”键,将其显示的超链接对象文件名删除,再回车,或选择,修改,|“移除链接,命令,都可以删除超链接而保留原文本对象 。
1,创建图像超链接
6.1.3 创建图像超链接给图像添加链接,使其指向其他的网页或者文档,就是图像超链接 。
（ 1） 选中需要建立超链接的图像,此时属性面板显示图像的属性 。
（ 2） 在属性面板中为图像添加文档相对路径的链接 。
（ 3） 按,F12”预览网页 。
2,删除图像超链接删除图片超链接与删除文本超链接的方法相同 。
锚记,也称为书签或锚点,用来标记文档中的特定位置,使用其可以跳转到当前文档或其他文档中的标记位置,免去浏览者翻阅网页寻找信息的麻烦 。 在网页中加入锚记包括两方面的工作,一是在网页中创建锚记,另一个就是为锚记建立链接 。
6.1.4 创建锚记超链接创建锚记的步骤如下：
（ 1） 将光标移到需要加入锚记的地方,一般是将光标放置在一行或是一段文字的开头部分 。
（ 2） 单击插入,常用,面板上的按钮,或是选择主窗口的菜单,插入,|“命名锚记,命令,将弹出
,命名锚记,对话框 。
（ 3） 在对话框的,锚记名称,文本框输入锚记的名称 。
（ 4） 单击,确定,按钮 。
1,创建锚记在命名锚记时,必须遵循以下规定：
① 只能使用字母和数字,锚记命名不支持中文 。 虽然在插入锚记对话框中能输入中文,但在属性面板上显示的则是一堆乱码,且在为锚记添加链接的时候,也无法工作 。
② 锚记名称的第 1个字符最好是英文字母,一般不要以数字作为锚记名称的开头 。
③ 锚记名称区别英文字母的大小写 。
④ 锚记名称间不能含有空格,也不能含有特殊字符 。
创建锚记后,还必须链接锚记 。 选择想要链接到锚记的文字或图片,然后按如下方法中的任意一种进行操作 。
2,链接锚记
（ 1） 在属性面板上的,链接,文本框中输入符号 # 和锚记名称 。
（ 2） 选择文字或图片后,按住 Shift键,然后拖动鼠标指向锚记 。
（ 3） 按住属性面板上的,指向文件,按钮,并拖动鼠标指向锚记 。
在链接锚记时,应注意以下事项：
① 在 #和锚记名之间不要留有空格,否则链接会失败 。
② 在不同文件夹中为锚记创建链按时,其文件名后缀必定是,,htm”,而不能写成,,html”,否则链接也会失败 。
③ 符号 #必须是半角符号,而不能为全角符号 。
如果希望浏览者在浏览网页时,只要浏览者单击
E-mail链接时,就会在浏览端自动打开浏览器默认的
E-mail处理程序,收件人的地址将会被 E-mail超链接中的指定地址自动装入,无需浏览者输入,就需要创建电子邮件链接 。
6.1.5 创建电子邮件超链接创建电子邮件链接的步骤如下：
（ 1） 将光标置于网页中要添加 E-mail链接的地方,或选中文字,通过插入,常用,面板上的,电子邮件链接,按钮,或通过主窗口菜单,插入,|“电子邮件链接,命令,将弹出,电子邮件链接,对话框 。
（ 2） 如果未选中文字,可以在,文本,文本框中添加所需文字；如果已经选中超链接文字,将会在,文本,文本框中自动显示 。 然后在,E-mail”文本框中输入 E-mail地址,单击,确定,按钮,就可以了 。
如果想让网站提供文件下载的功能,就必须建立下载文件超链接 。 实现文件下载的功能很简单,只需加入连接到文件的超链接就可以了 。 连接到网站中下载文件的超链接也算是内部超链接中的一种 。
创建下载文件超链接的方法如下：
首先选择主窗口的菜单,站点,|“站点文件,命令,打开站点窗口,找到需要链接的目标文件 。 然后选择网页中需建立超链接的文字,按下,Shift”键拖动鼠标到站点窗口中的目标文件 。
6.1.6 创建下载文件超链接空链接是一个未指定目标的链接,Dreamweaver
MX的行为面板中列出了许多行为,这些行为相当于使用 JavaScript编写的程序或函数,要想对文本设置行为,首先为文本建立空链接,这样行为才有效 。
为文本建立空链接时,只要先在文档窗口选定文本,然后在属性面板中的,链接,栏中输入一个数值符,#”即可 。 建立空链接的目的就是为了应用行为,
其他情况下不必建立空链接 。
6.1.7 创建空链接用 HTML创建超链接需要使用 A标记符 （ 结束标记符 </A>不能省略 ）,它的最基本属性是 href,用于指定超链接的目标 。 通过为 href指定不同的值,可以创建出不同类型的超链接 。 另外,在 <A>和 </A>之间可以用任何可单击的对象作为超链接的源,例如文字或图像 。
6.2 利用 HTML创建超链接
6.2.1 页面链接如果要设置锚记超链接,首先应为页面中需要跳转到的位置命名 。 命名时应使用 A标记符的 name属性,
在标记符 <A>与 </A>之间可以包含内容,也可以不包含内容 。
例如,可以在页面开始处用以下 HTML语句进行标记：
<A name="top">目录 </A>
对页面进行标记之后,就可以用 A标记符设置指向这些标记位置的超链接 。 如果在页面开始处标记了
"top",则可以用以下 HTML语句进行链接：
<A href="#top">返回目录 </A>
6.2.2 锚记链接如果将 href属性的取值指定为,mailto:电子邮件地址,,那么就可以获得电子邮件链接的效果 。 例如,
使用以下 HTML代码可以设置电子邮件超链接：
<A href="mailto,qjl@eyou.com">作者邮箱 </A>
当浏览网页的用户单击了指向电子邮件的超链接后,系统将自动启动邮件客户程序,并将指定的邮件地址填写到,收件人,栏中,用户可以编辑并发送该邮件 。
6.2.3 电子邮件链接利用站点地图建立网页间的超链接的步骤如下：
（ 1） 在菜单栏中单击,站点,|“站点地图,,或按
Alt+F8组合键打开站点窗口 （ 按 F8键,可快速打开
Site窗口 ） 。
（ 2） 选中需要链接的文件,比如 index.htm,在鼠标右键快捷菜单中选择,链接到新文件,或,链接到已有文件,,即可建立网页间的超链接 。
6.3 利用站点地图管理超链接
6.3.1 建立网页间的超链接对于不需要的链接关系,在站点地图的树状结构上可以非常轻松地解除 。
解除超链接的步骤如下：
（ 1） 树状结构上选择要解除链接关系的对象图标 。
（ 2） 在右键快捷菜单中选择,移除链接,命令,即可解除网页间的超链接 。
6.3.2 解除网页间的超链接在,站点,浮动面板的站点地图上更改文件的名称与 Windows下的操作基本相同 。
（ 1） 首先单击选中欲更改名称的文件 。
（ 2） 再次单击该文件的文件名,输入新的文件名后按一下回车键即可 。
（ 3） 当文件被更名后,系统会弹出,更新文件,对话框,询问站点中被链接的网页名称是否也作修改 。
（ 4） 在该对话框中单击,更新,按钮即可完成操作 。
6.3.3 更新超链接
Dreamweaver MX提供,结果,浮动面板组,除了具有检查浏览器兼容性,代码兼容性等强大功能外,
还可以利用它来检查甚至修改站点中的超链接 。
6.3.4 检查超链接可以在 Dreamweaver MX的,站点,浮动面板上选择,文件,|“检查链接,命令,在打开的下拉菜单中选择,为整个站点检查链接,命令 。
1,自动对整个站点的超链接情况进行检查 。
如果在,链接检查器,浮动面板的,显示,标识符后的下拉列表框中选择,断掉的链接,选项,则
Dreamweaver MX将自动列出网站中所有的断掉的链接 。
2,修复站点中的超链接如果在,结果,面板中,链接检查器,选项卡的
,显示,标识符后的下拉列表中选择,外部链接,选项,则 Dreamweaver MX将自动列出网站中所有的外部超链接文件 。
3,处理外部超链接所谓孤立文件并不是指没有用的文件,而是指没有与其他网页发生链接的文件 。
如果在,结果,面板中,链接检查器,选项卡的
,显示,标识符后的下拉列表中选择,孤立文件,选项,则 Dreamweaver MX将自动列出网站中所有孤立的文件 。
对于该列表中的文件,除非是经过检查后确定这些文件是没有用的,才可以删除,否则最好不要一次全部删除,以免追悔莫及 。
4,处理孤立文件
E N D
1,认识超链接
2,利用 Dreamweaver MX创建各种超连接的方法
3,利用 Dreamweaver MX编辑各种超连接的方法
4,利用 HTML创建,编辑超链接的方法
5,利用站点地图管理超链接的方法第 6章 在网页中使用超链接
6.1 利用 Dreamweaver MX处理超链接
6.1.1 超链接简介
1,什么是超链接所谓的超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序 。 而在一个网页中用来超链接的对象,可以是一段文本或者是一个图片 。 当浏览者单击已经链接的文字或图片后,链接目标将显示在浏览器上,并且根据目标的类型来打开或运行 。
按照链接路径的不同,网页中超链接一般分为以下 3种类型：
内部链接：即在同一个站点内的不同页面之间相互联系的超链接 。
锚点链接：可以链接到网页中某个特定位置的链接 。
外部链接：把网页与 Internet中的目标相联系的链接 。
如果按照使用对象的不同,网页中的链接又可以分为：文本超链接,图像超链接,E-mail链接,锚点链接,多媒体文件链接,空链接等合理安排超链接在网页的制作中是非常重要的 。
采用什么结构的链接会直接影响到网页的布局 。 建议,
避免孤立文件的存在
在网页中避免使用过多的超链接
网页中的超链接不要超过 4层
页面较长时可以使用书签
设置主页或上一层的链接
2,合理安排超链接
3,文档路径类型在一个网站中,有绝对路径,和根目录相对路径以及和文档相对路径 3种类型的文档路径 。
绝对路径：是包含服务器协议 （ 对于网页来说通常是 http://或 ftp://） 的完全路径 。
和根目录相对的路径：是从当前站点的根目录开始的路径 。 站点上所有可公开的文件都存放在站点的根目录下 。
和文档相对的路径：是指和当前文档所在的文件夹相对的路径 。
6.1.2 创建文本超链接
1,建立文本超链接在浏览网页时,鼠标指针经过某些文本时,指针的形状发生变化,同时文本也会发生变化 （ 如出现下划线,文本的颜色发生变化,字体发生变化等 ）,提示这是带链接的文本 。 此时点击鼠标,就会打开所链接的网页,这就是文本超链接 。
在 Dreamweaver MX中创建文本超链接的步骤为：
（ 1） 在网页上选择需要添加超链接的文本,打开文本的属性面板 。
（ 2） 在属性面板上指定文字的链接目标 。
（ 3） 在,目标,下拉列表框中选择目标文件打开的方式 。
设置结束后,在网页中被选择的文字改变了颜色,
且在文字底部出现一条下划线,即文字的超链接设置完成 。 在键盘上按,F12”键,即可将网页在浏览器中打开 。 单击链接的文字,即可打开目标文件 。
2,编辑文本超链接
（ 1） 设置文本链接的状态一个未被访问过的链接与一个被激活的链接在形式上肯定会有所区别,链接被访问过了也会发生变化,提示用户这是一个已经点击过 的链接,
所有这些都是链接的状态 。 通过设置不同的文本颜色可以使各个状态区别开来 。
（ 2） 删除文本超链接在 Dreamweaver MX中要删除一个文本超链接很容易,先用鼠标选定文本对象,将光标定位于属性面板的,链接,文本框中,用,BackSpace”
键或,Delete”键,将其显示的超链接对象文件名删除,再回车,或选择,修改,|“移除链接,命令,都可以删除超链接而保留原文本对象 。
1,创建图像超链接
6.1.3 创建图像超链接给图像添加链接,使其指向其他的网页或者文档,就是图像超链接 。
（ 1） 选中需要建立超链接的图像,此时属性面板显示图像的属性 。
（ 2） 在属性面板中为图像添加文档相对路径的链接 。
（ 3） 按,F12”预览网页 。
2,删除图像超链接删除图片超链接与删除文本超链接的方法相同 。
锚记,也称为书签或锚点,用来标记文档中的特定位置,使用其可以跳转到当前文档或其他文档中的标记位置,免去浏览者翻阅网页寻找信息的麻烦 。 在网页中加入锚记包括两方面的工作,一是在网页中创建锚记,另一个就是为锚记建立链接 。
6.1.4 创建锚记超链接创建锚记的步骤如下：
（ 1） 将光标移到需要加入锚记的地方,一般是将光标放置在一行或是一段文字的开头部分 。
（ 2） 单击插入,常用,面板上的按钮,或是选择主窗口的菜单,插入,|“命名锚记,命令,将弹出
,命名锚记,对话框 。
（ 3） 在对话框的,锚记名称,文本框输入锚记的名称 。
（ 4） 单击,确定,按钮 。
1,创建锚记在命名锚记时,必须遵循以下规定：
① 只能使用字母和数字,锚记命名不支持中文 。 虽然在插入锚记对话框中能输入中文,但在属性面板上显示的则是一堆乱码,且在为锚记添加链接的时候,也无法工作 。
② 锚记名称的第 1个字符最好是英文字母,一般不要以数字作为锚记名称的开头 。
③ 锚记名称区别英文字母的大小写 。
④ 锚记名称间不能含有空格,也不能含有特殊字符 。
创建锚记后,还必须链接锚记 。 选择想要链接到锚记的文字或图片,然后按如下方法中的任意一种进行操作 。
2,链接锚记
（ 1） 在属性面板上的,链接,文本框中输入符号 # 和锚记名称 。
（ 2） 选择文字或图片后,按住 Shift键,然后拖动鼠标指向锚记 。
（ 3） 按住属性面板上的,指向文件,按钮,并拖动鼠标指向锚记 。
在链接锚记时,应注意以下事项：
① 在 #和锚记名之间不要留有空格,否则链接会失败 。
② 在不同文件夹中为锚记创建链按时,其文件名后缀必定是,,htm”,而不能写成,,html”,否则链接也会失败 。
③ 符号 #必须是半角符号,而不能为全角符号 。
如果希望浏览者在浏览网页时,只要浏览者单击
E-mail链接时,就会在浏览端自动打开浏览器默认的
E-mail处理程序,收件人的地址将会被 E-mail超链接中的指定地址自动装入,无需浏览者输入,就需要创建电子邮件链接 。
6.1.5 创建电子邮件超链接创建电子邮件链接的步骤如下：
（ 1） 将光标置于网页中要添加 E-mail链接的地方,或选中文字,通过插入,常用,面板上的,电子邮件链接,按钮,或通过主窗口菜单,插入,|“电子邮件链接,命令,将弹出,电子邮件链接,对话框 。
（ 2） 如果未选中文字,可以在,文本,文本框中添加所需文字；如果已经选中超链接文字,将会在,文本,文本框中自动显示 。 然后在,E-mail”文本框中输入 E-mail地址,单击,确定,按钮,就可以了 。
如果想让网站提供文件下载的功能,就必须建立下载文件超链接 。 实现文件下载的功能很简单,只需加入连接到文件的超链接就可以了 。 连接到网站中下载文件的超链接也算是内部超链接中的一种 。
创建下载文件超链接的方法如下：
首先选择主窗口的菜单,站点,|“站点文件,命令,打开站点窗口,找到需要链接的目标文件 。 然后选择网页中需建立超链接的文字,按下,Shift”键拖动鼠标到站点窗口中的目标文件 。
6.1.6 创建下载文件超链接空链接是一个未指定目标的链接,Dreamweaver
MX的行为面板中列出了许多行为,这些行为相当于使用 JavaScript编写的程序或函数,要想对文本设置行为,首先为文本建立空链接,这样行为才有效 。
为文本建立空链接时,只要先在文档窗口选定文本,然后在属性面板中的,链接,栏中输入一个数值符,#”即可 。 建立空链接的目的就是为了应用行为,
其他情况下不必建立空链接 。
6.1.7 创建空链接用 HTML创建超链接需要使用 A标记符 （ 结束标记符 </A>不能省略 ）,它的最基本属性是 href,用于指定超链接的目标 。 通过为 href指定不同的值,可以创建出不同类型的超链接 。 另外,在 <A>和 </A>之间可以用任何可单击的对象作为超链接的源,例如文字或图像 。
6.2 利用 HTML创建超链接
6.2.1 页面链接如果要设置锚记超链接,首先应为页面中需要跳转到的位置命名 。 命名时应使用 A标记符的 name属性,
在标记符 <A>与 </A>之间可以包含内容,也可以不包含内容 。
例如,可以在页面开始处用以下 HTML语句进行标记：
<A name="top">目录 </A>
对页面进行标记之后,就可以用 A标记符设置指向这些标记位置的超链接 。 如果在页面开始处标记了
"top",则可以用以下 HTML语句进行链接：
<A href="#top">返回目录 </A>
6.2.2 锚记链接如果将 href属性的取值指定为,mailto:电子邮件地址,,那么就可以获得电子邮件链接的效果 。 例如,
使用以下 HTML代码可以设置电子邮件超链接：
<A href="mailto,qjl@eyou.com">作者邮箱 </A>
当浏览网页的用户单击了指向电子邮件的超链接后,系统将自动启动邮件客户程序,并将指定的邮件地址填写到,收件人,栏中,用户可以编辑并发送该邮件 。
6.2.3 电子邮件链接利用站点地图建立网页间的超链接的步骤如下：
（ 1） 在菜单栏中单击,站点,|“站点地图,,或按
Alt+F8组合键打开站点窗口 （ 按 F8键,可快速打开
Site窗口 ） 。
（ 2） 选中需要链接的文件,比如 index.htm,在鼠标右键快捷菜单中选择,链接到新文件,或,链接到已有文件,,即可建立网页间的超链接 。
6.3 利用站点地图管理超链接
6.3.1 建立网页间的超链接对于不需要的链接关系,在站点地图的树状结构上可以非常轻松地解除 。
解除超链接的步骤如下：
（ 1） 树状结构上选择要解除链接关系的对象图标 。
（ 2） 在右键快捷菜单中选择,移除链接,命令,即可解除网页间的超链接 。
6.3.2 解除网页间的超链接在,站点,浮动面板的站点地图上更改文件的名称与 Windows下的操作基本相同 。
（ 1） 首先单击选中欲更改名称的文件 。
（ 2） 再次单击该文件的文件名,输入新的文件名后按一下回车键即可 。
（ 3） 当文件被更名后,系统会弹出,更新文件,对话框,询问站点中被链接的网页名称是否也作修改 。
（ 4） 在该对话框中单击,更新,按钮即可完成操作 。
6.3.3 更新超链接
Dreamweaver MX提供,结果,浮动面板组,除了具有检查浏览器兼容性,代码兼容性等强大功能外,
还可以利用它来检查甚至修改站点中的超链接 。
6.3.4 检查超链接可以在 Dreamweaver MX的,站点,浮动面板上选择,文件,|“检查链接,命令,在打开的下拉菜单中选择,为整个站点检查链接,命令 。
1,自动对整个站点的超链接情况进行检查 。
如果在,链接检查器,浮动面板的,显示,标识符后的下拉列表框中选择,断掉的链接,选项,则
Dreamweaver MX将自动列出网站中所有的断掉的链接 。
2,修复站点中的超链接如果在,结果,面板中,链接检查器,选项卡的
,显示,标识符后的下拉列表中选择,外部链接,选项,则 Dreamweaver MX将自动列出网站中所有的外部超链接文件 。
3,处理外部超链接所谓孤立文件并不是指没有用的文件,而是指没有与其他网页发生链接的文件 。
如果在,结果,面板中,链接检查器,选项卡的
,显示,标识符后的下拉列表中选择,孤立文件,选项,则 Dreamweaver MX将自动列出网站中所有孤立的文件 。
对于该列表中的文件,除非是经过检查后确定这些文件是没有用的,才可以删除,否则最好不要一次全部删除,以免追悔莫及 。
4,处理孤立文件
E N D
