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

《HTML+CSS+DIV网页设计与布局 教学课件 作者 聂斌 1_ 第3章 超链接.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第3章超链接超链接是网站中最重要的组成部分，HTML有了超链接才显得与众不同。超链接可以方便用户的使用，允许浏览者从一个网页跳转到另一个网页，多个网页因为有了超链接才会形成了一个网站。超链接不仅仅可以链接网页，还可以链接图片、视频、音频，甚至是任何一种文件。3.1创建超链接在实际应用中很少有网页是单独的，通常都会使用超链接来创建一个页面与其他页面之间的联系。同样的也可以使用超链接创建与其他Web服务器上的网页联系。使用超链接不仅仅可以链接网页文件，也可以链接其他文件。3.1.1超链接标记在HTML中，创建超链接的标记是。标记是双标记。以开始，以结束。标记

2、创建的链接能指向一个HTML页面、一幅图像、一个视频文件等任何资源，其语法如下所示：超链接文字3.1.1超链接标记超链接由以下五个重要组成部分：（1）在一个超链接里，最重要的部分是目标地址。当浏览者单击该超链接时，会出现什么内容，全是由目标地址来决定的。（2）超链接的第二个重要部分是链接文字，这个文字的作用是让浏览者看到并单击。（3）超链接的第三个组成部分是标题。（4）超链接的第四个组成部分是目标窗口。（5）超链接的第五个组成部分是锚。3.1.2链接地址链接地址用于设置超级链接的路径，可以使

3、用标记中的HEAR属性来进行设置。设置超级链接地址的语法是：用来设置超级链接的元素3.1.2链接地址绝对路径，实际就是完整路径。例如设置路径为“C:Programfiles1.htm”，在本地确实可以找到，但是到了网站上该文件不一定在这个路径下，所以就会出问题。相对路径，顾名思义就是自己相对于目标位置的路径。一般有如下3种相对路径的写法：同一目录下的文件：只需要输入链接文件的名称即可，如：01.html。上一级目录中的文件，在目录名和文件名之前加入“../”，如：../04/02.html；如果是上两级，则需要加入两个“../”，如：../

4、../file/01.html。下一级目录：输入目录名和文件名，之间以“/”隔开，如：Html/05/01.html。3.1.3打开链接的方式当单击一个网页里的超链接时，通常都会在当前窗口打开超链接目标页面。如果想保留当前网页的内容，让链接的页面从一个新建窗口里打开，那应该怎么办？使用元素的TARGET属性可以实现这个功能。TARGET属性用来设置打开链接的方式，其语法如下所示：用来链接的元素在HTML语言中，超链接的TARGET属性可以取4个值，这些值的具体含义如下表所示。3.2锚点在超级链接中，有一种特殊

5、的链接形式，称为锚点链接。如果一个网页包含的内容很多，要想在整个网页里快速查找到自己感兴趣的内容，就不会那么方便的了。这时可以通过锚点帮助用户方便地到达当前页面的其他位置。3.2.1创建锚点要使用锚点引导浏览者，就要首先创建页面中的锚点。创建的锚点将确定链接的目标位置。其语法是：锚点的链接文字3.2.2链接到本页锚点如果要链接到本页的命名锚上，只要在元素的HREF属性里指定锚点名称，并在该名字前加上“#”字符。锚点的名称就是3.2.1节中NAME属性的属性值。链接到本页锚点的语法如下所示：锚点的链接文字3.

6、2.3链接到其他网页的锚点通常在单击一个超链接时，都会打开一个网页，并且默认显示该网页的顶端，而不会是网页的底部，或网页的其他位置。如果想要打开一个网页，并且显示网页的某个区域，就必须要创建命名锚。使用元素的NAME属性可以在网页上设置链接到其他网页的锚点，其语法如下所示：用于链接锚点的文字3.3图像的超链接标记不仅可以为文字设置超链接，还可以为图片设置超链接。为图片设置超链接有两种方式，一种是将整个图片设置链接，只要单击该图片，就可以跳转到链接的URL上。另一种是为图片设置热点区域，将图片划分多个区域，单击图片不同的位置将会跳

7、转到不同的链接之上。3.3.1将整个图像设为链接将整个图像设为链接的方法很简单，只需要将标记中的文字换成元素，在元素中将需要设置为超链接图片添加上即可。其语法如下所示：3.3.2设置图像热点区域除了可以为整个图像设置链接外，还可以为图像设置热点区域，也就是将一个图片划分成多个可单击的区域，单击不同的区域将跳到不同的链接上。在定义图像热点区域的时候，除了