Web前端开发——超链接与浮动框架(上)

学习目标：

通过对本节超链接和浮动框架等知识的学习，读者能够掌握超链接和浮动框架的语法和创建方法，理解超链接的分类以及路径等相关概念，学会利用超链接设置书签、文件下载、FTP下载、电子邮件链接等，会使用超链接与浮动框架关联设计Web网页导航。

Web前端开发工程师应知应会以下内容：

①掌握超链接的基本标记语法和属性设置方法。

②理解超链接的分类，以及路径、书签等概念。

③学会使用超链接实现文件下载、FTP 下载、电子邮件链接、图像链接。

④学会使用超链接制作书签。

⑥学会使用浮动框架实现内嵌页面的显示。

一、超链接概述 

有了超链接，各个独立的网页便可以有机地链接在一起构成一个网站。所谓超链接，是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片、一个电子邮件地址、一个文件，甚至一个应用程序。用户通过浏览器浏览网页，打开页面上的超链接后，可以访问新的页面上的内容。

二、超链接的语法、路径及分类

2.1 超链接的语法

在网页文件中，超链接通常使用链接a标记的超文本引用href(HyperText Reference)属性建立目标对象，当前文档便是链接源，href设置的属性值是目标文件。

2.1.1 基本语法

<a href="url" name=""title="提示消息"target="窗口名称">超链接标题</a>

2.1.2 语法说明

超链接a标记以<a>开始，以</a>结束。其间内容为超链接标题。超链接由目的地址在接标题、打开位置三部分组成。

2.1.3 属性说明

href：链接指向的目标文件。
name：规定锚(anchor)的名称。
title：指向链接的提示信息。
target：指定打开的目标窗口，如下表所示。

2.2 超链接的路径

在网页设计中超链接a标记的ME网性定义链接所访间的目标地址，也称为访问路径每一个网页都有一个相对固定的地址一即统一资源定行A08D)，通过独立的URL可以问不同网站上的不同页面。在HTNL文档中提供子3种路径，分别是绝对路径、相对路径和根路径。

2.2.1 绝对路径

绝对路径指文件的完整路径，包括盘符或文件传输的协议htp、ftp等，一般用于网站的外部链接。绝对路径有两种：一种是从盘符开始定义的文件路径，例如“E:\web\index.htm!"；另一种是从协议开始定义的URL网址，例如中国教育与科研计算机网的网址“http:www. edu.cn”。

2.2.2 相对路径

相对路径相对路径是指相对于当前文件的路径，从当前文件所在位置指向目标文件的路径。采用相对路径是建立两个文件之间的相互关系，相对路径一般用于网站内部链接。相对位置的输人方法如下表所示。

2.2.3 根路径

根路径是指从网站的最底层开始,一般网站的根目录就是域名下对应的文件夹，例如E盘上存放一个网站，双击E盘进人E盘看到的就是网站的根目录，这种路径称为根路径，以根路径以斜杠“/”开头，然后书写文件夹名，接着书写子文件夹名或文件名，以此类推，到写完路径为止。例如“/web/news/show.htm!”。
根路径一般用于创建内部链接。通常不建议采用此种链接形式根目录路径和相对路径都是以某个位置为起点的相对路径，但是根目录路径一般用于有多台服务器的大型网站，建议对路径的概念不太熟悉的初学者在做链接时采用相对路径。另外，为了避免出现链接错误，不管使用何种类型的链接，站点的建立是必要的。

2.3 超链接的分类

在HTML文档中，超链接可以分为内部链接和外部链接两种。内部链接是指网站内部文件之间的链接，而外部链接是指网站内的文件链接到网站外的文件。将URL设置为相对路径为内部链接，而将URL设置为文件的绝对路径为外部链接。

ps:关于Web前端开发——超链接与浮动框架(上)就到这，下节我们更新下期超链接的应用和浮动框架，有问题欢迎大家指出。