【例】 超链接颜色设置示例 <html>
<head> <title>链接颜色的变化</title>
</head> <body text=blue alink=red vlink=yellow link=green>
注意<a href=1.html>颜色</a>的变化 </body> </html>
烟台南山学院-----计算机应用技术学院
第四章
建立超链接
2019/12/25
第4章 建立超链接
4.1 从HTML的角度理解超链接
4.2 使用Dreamweaver 8设置超链接 4.3 实践与练习：为文字添加超链接
4.4 实践与练习：鼠标经过图像
4.5
实践与练习：导航条
小结
2019/12/25
2
第4章 建立超链接
与超链接相关的一个概念是定位点（也称锚 点），它指明了网页中一个确定的位置，以便超 链接跳转时定位。
2019/12/25
5
4.1从HTML的角度理解超链接
4.1.1 理解路径的概念 1、超级链接及路径的概念
超级链接是指站点内不同网页之间、站点与Web之间的链接 关系，它可以使站点内的网页成为有机的整体，还能够使不 同站点之间建立联系。例如，当浏览者单击已经链接的文字 或图像时，链接目标将显示在浏览器上，并且根据目标的类 型来打开或运行。
/index.asp
绝对路径指的是精确位置，如果目标文件被移到其 他位置，则超级链接无效。如果用户要创建的是外 部链接，即创建不同网站文档之间的链接，则必须 使用绝对路径。
2019/12/25
9
4.1从HTML的角度理解超链接
（2）文件相对路径
文件相对路径是指和当前文档所在 的文件夹相对的路径。
2019/12/25
3
第4章 建立超链接
主要内容：
了解超链接的概念和路径知识; 掌握超级链接的基本概念和创建方法； 从HTML的角度理解超链接; 使用Dreamweaver 8设置超链接.
2019/12/254来自第4章 建立超链接超链接就是当用鼠标单击一些文字、图片或 其他网页元素时，浏览器就会根据其指示载入一 个新的页面或跳转到页面的其他位置。
4.1 从HTML的角度理解超链接
文字超链接预览
2019/12/25
14
4.1 从HTML的角度理解超链接
4.1.3 设置文字链接的颜色 超链接可以通过设置链接的颜色来表示链 接是否已经被单击，注意这是在<body>标 签中设置的，而不是在<a>标签中。
2019/12/25
15
4.1 从HTML的角度理解超链接
本章简介：
前面两章中所做的工作仅仅是使网页中可以 显示文本和图像，虽说是“图文并茂”了，但这 对于网页来说还很不够。为了使网站中的众多网 页构成一个整体，必须使各网页通过超链接的方 式联系起来，也就是说，使访问者能够在各个页 面之间跳转。
网络中的每个网页都是通过超链接的形式关 联在一起的，超链接是网页中最重要、最根本的 元素之一。浏览者可以通过鼠标单击网页中的某 个元素，轻松的实现网页之间的转换或下载文件、 收发邮件等。
2019/12/25
12
4.1 从HTML的角度理解超链接
文字超链接示例 <html>
<head> <title>超链接</title>
</head> <body>
单击<a href=1.html>这里</a>链接到一个 图片网页超链接的建立
</body> </html>
2019/12/25
13
若要创建从站点根目录的 index.htm到list.htm的链接， 链接路径为“list.htm”。
若要创建从list.htm到help目 录下的help.htm的链接，链接 路径为“help/help.htm”。
2019/12/25
10
4.1从HTML的角度理解超链接
（2）文件相对路径
2019/12/25
6
4.1从HTML的角度理解超链接
2．超级链接的分类 （1）按链接载体分类，把链接分为文本链接与图像链接两大类。 文本链接：用文本作链接载体，简单实用。 图像链接：用图像作为链接载体能使网页美观、生动活泼，它既
可以指向单个的链接，也可以根据图像不同的区域建立多个链接。 （2）按链接目标分类，将超级链接分为以下几种类型： 内部链接：同一网站内文档之间的链接。 外部链接：不同网站文档之间的链接。 锚点链接：同一网页或不同网页中指定位置的链接。 E-mail链接：发送电子邮件的链接，可直接点击发送电子邮件。 执行文件链接：链接站点空间里的可执行程序，用于下载在线运
2019/12/25
11
4.1 从HTML的角度理解超链接
4.1.2 文字超链接 建立超链接所使用的HTML标签为<a>和</a>。 在“<a>”标签中，“href”属性是必要属性，
用来放置超链接的目标地址，该目标可以 是本机上的某个HTML文件，也可以是其他 网站上的URL地址。 “<a>” 和“</a>”之间的内容为超链接名 称。
行。
2019/12/25
7
4.1从HTML的角度理解超链接
3、链接路径
路径的作用就是定位一个文件的位置，使用过 Windows的用户都会了解文件夹和子文件夹，这 本身就是路径的概念。 例如：链接到的“1.html”就是一个路径，直接 使用文件名表示这个文件和原来的网页文件在同 一个文件夹中。如果链接到的网页不和原网页在 同一个文件夹中，就不能这样写了。
2019/12/25
8
4.1从HTML的角度理解超链接
（1）绝对路径
绝对路径是指某个文件在网络上的完整路径，包括 协议、Web服务器、路径和文件名等。简单地说，如 果在浏览器地址栏中输入就能直接访问的文件地址， 就可以看作是绝对路径。例如，下面的地址就是绝 对路径：
若要创建从help目录下的help.htm 到站点根目录下的list.htm的链接， 链接路径为“../list.htm”。 若要创建从product01.htm到help目 录下的help.htm的链接，链接路径为 “../help/help.htm”，也就是要先向 上后退一级目录，再向下一级目录找 到要链接的网页。
