新HTML+CSS+DIV网页设计与布局 教学课件 聂斌 1_ 第3章 超链接.ppt

在线教务辅导网： 教材其余课件及动画素材请查阅在线教务辅导网 QQ:349134187 或者直接输入下面地址： 第3章 超链接 超链接是网站中最重要的组成部分，HTML有了超链接才显得与众不同。超链接可以方便用户的使用，允许浏览者从一个网页跳转到另一个网页，多个网页因为有了超链接才会形成了一个网站。超链接不仅仅可以链接网页，还可以链接图片、视频、音频，甚至是任何一种文件。 3.1 创建超链接 在实际应用中很少有网页是单独的，通常都会使用超链接来创建一个页面与其他页面之间的联系。同样的也可以使用超链接创建与其他Web服务器上的网页联系。使用超链接不仅仅可以链接网页文件，也可以链接其他文件。 3.1.1 超链接标记 在HTML中，创建超链接的标记是A。A标记是双标记。以A开始，以/A结束。A标记创建的链接能指向一个HTML页面、一幅图像、一个视频文件等任何资源，其语法如下所示： A NAME=锚名称 HREF=URL TITLE=标题 TARGET=目标超链接文字/A 3.1.1 超链接标记 超链接由以下五个重要组成部分： （1）在一个超链接里，最重要的部分是目标地址。当浏览者单击该超链接时，会出现什么内容，全是由目标地址来决定的。 （2）超链接的第二个重要部分是链接文字，这个文字的作用是让浏览者看到并单击。 （3）超链接的第三个组成部分是标题。 （4）超链接的第四个组成部分是目标窗口。 （5）超链接的第五个组成部分是锚。 3.1.2 链接地址 链接地址用于设置超级链接的路径，可以使用A标记中的HEAR属性来进行设置。设置超级链接地址的语法是： A HREF=链接地址用来设置超级链接的元素/A 3.1.2 链接地址 绝对路径，实际就是完整路径。例如设置路径为“C:\Program files\1.htm”，在本地确实可以找到，但是到了网站上该文件不一定在这个路径下，所以就会出问题。 相对路径，顾名思义就是自己相对于目标位置的路径。一般有如下3种相对路径的写法： 同一目录下的文件：只需要输入链接文件的名称即可，如：01.html。 上一级目录中的文件，在目录名和文件名之前加入“../”，如：../04/02.html；如果是上两级，则需要加入两个“../”，如：../../file/01.html。 下一级目录：输入目录名和文件名，之间以“/”隔开，如：Html/05/01.html。 3.1.3 打开链接的方式 当单击一个网页里的超链接时，通常都会在当前窗口打开超链接目标页面。如果想保留当前网页的内容，让链接的页面从一个新建窗口里打开，那应该怎么办？使用A元素的TARGET属性可以实现这个功能。TARGET属性用来设置打开链接的方式，其语法如下所示： A HREF=链接地址 TARGET=目标页面的打开方式用来链接的元素/A 在HTML语言中，超链接的TARGET属性可以取4个值，这些值的具体含义如下表所示。 3.2 锚点 在超级链接中，有一种特殊的链接形式，称为锚点链接。如果一个网页包含的内容很多，要想在整个网页里快速查找到自己感兴趣的内容，就不会那么方便的了。这时可以通过锚点帮助用户方便地到达当前页面的其他位置。 3.2.1 创建锚点 要使用锚点引导浏览者，就要首先创建页面中的锚点。创建的锚点将确定链接的目标位置。其语法是： A NAME=锚点名称锚点的链接文字/A 3.2.2 链接到本页锚点 如果要链接到本页的命名锚上，只要在A元素的HREF属性里指定锚点名称，并在该名字前加上“#”字符。锚点的名称就是3.2.1节中NAME属性的属性值。链接到本页锚点的语法如下所示： A HREF=#锚点名称锚点的链接文字/A 3.2.3 链接到其他网页的锚点 通常在单击一个超链接时，都会打开一个网页，并且默认显示该网页的顶端，而不会是网页的底部，或网页的其他位置。 如果想要打开一个网页，并且显示网页的某个区域，就必须要创建命名锚。使用A元素的NAME属性可以在网页上设置链接到其他网页的锚点，其语法如下所示： A HREF=页面地址#锚点名称用于链接锚点的文字/A 3.3 图像的超链接 A标记不仅可以为文字设置超链接，还可以为图片设置超链接。为图片设置超链接有两种方式，一种是将整个图片设置链接，只要单击该图片，就可以跳转到链接的URL上。另一种是为图片设置热点区域，将图片划分多个区域，单击图片不同的位置将会跳转到不同的链接之上。 3.3.1 将整个图像设为链接 将整个图像设为链接的方法很简单，只需要将A标记中的文字换成IMG元素，在IMG元素中将需要设置为超链接图片添加上即可。其语法如下所示： A HREF=链接地址IMG SRC=源文件地址/A 3.