网页设计与制作_教学课件 朱金华 第5章 超链接

《网页设计与制作_教学课件 朱金华 第5章 超链接》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第5章超链接教学目标1.了解超链接的概念2.掌握超链接的分类3.掌握链接对象的不同类型4.学会创建超链接的方法5.学会设置网页链接的属性6.掌握图像映射教学内容5.1创建超链接5.2链接对象5.3网页链接属性设置5.4图像映射教学重点和难点重点：创建超链接、链接对象、网页链接属性设置、图像映射难点：创建超链接、链接对象导入：网页上的不同链接对象例：搜狐网页文件的最大魅力是超越各个文件的空间，通过超链接相互连接构成一个纷繁复杂的互联网世界。超链接（hyperlink）是一个网站的精髓，超链接在本质上属

2、于一个网页的一部分，它是一种允许一个网页同其他网页或站点之间进行链接的元素。各个网页链接在一起后，才能真正构成一个网站。5.1创建超链接超链接的标记：建立超链接的标记是a（anchor,锚），以开始，以结束。基本语法：超链接名称语法说明：（1）：标记表示一个链接的开始，表示链接的结束。5.1创建超链接（2）href：链接的属性，和URL结合定义了这个链接所指的目标

3、地址。url资源地址，是要链接到的网页或者文件的地址。URL可以是一个绝对的网页，或是一个相对网页，还可以是一个pdf等其他文档。5.1创建超链接（3）target：用于指定目标窗口的打开方式，其默认方式是原窗口，其具体的值如下：_blank：在新窗口载入文档，可同时打开多个相同窗口。但如无特殊需要请勿滥用。_self：在被点击的同一框架中打开被链接文档（默认）。_parent：在父框架集中打开被链接文档。_top：在窗口主体中打开被链接文档。new：在新窗口载入文档，但只打开一个窗口（受浏览器限制

4、）。说明：_self、_parent和_top这三个值大多数时候与iframe一起使用。5.1创建超链接（4）title：用于指定指向链接时所显示的提示信息。（5）超链接名称：链接目标资源的文字显示说明，浏览时单击“超链接名称”，就会链接到指定URL的资源。5.1创建超链接示例HTML代码：5.1创建超链接5.1.1设置超链接路径在HTML文件中，主要提供了三种路径：绝对路径、相对路径和根路径，不同的路径使用在不同的链接中。5.1创建超链接1.绝对路径绝对路径指文件的完整路径，包括完整的协议名称、主

5、机名称、文件夹名称和文件名称。一般用于网站的外部链接。常见的绝对路径有：（1）http链接：http://www.sina.com.cn。（2）ftp链接：ftp://192.168.190.110。5.1创建超链接2.相对路径相对路径是以当前文件所在的路径为起点，进行相对文件的查找，包含了从当前文件指向目标文件的路径。如：（1）如果链接到同一目录下的文件main.html，则路径的设置方法为：href=”main.html”。（2）如果要链接到下级子目录中的文件，如main.html是本地当前路径

6、下称为“web”子目录下的文件，则路径的设置方法为：href=”web/main.html”。5.1创建超链接（3）如果要链接到上一级子目录中的文件，如main.html是本地当前目录的上一级子目录下的文件，则路径的设置方法为：href=”../main.html”。（4）如果要链接到上两级子目录中的文件，如main.html是本地当前目录的上两级子目录下的文件，则路径的设置方法为：href=”../../main.html”。思考：表示什么意思？3

7、.根路径根路径适用于创建内部链接，但是大多数情况下，不建议使用根路径。书写方法，一般以一个斜线开头代表根目录。5.1创建超链接5.1.2内部链接所谓内部链接，指的是在同一个网站内部，不同的html页面之间的链接关系，在建立网站内部链接的时候，要明确哪个是主链接文件（即当前页），哪个是被链接文件。内部链接一般采用相对路径链接比较好。假如某网站的news子目录下有两个文件news1.html和news2.html，如表5-1所示展示了内部链接语句中相对路径的写法。5.1创建超链接表5-1站点内部链接5.

8、1创建超链接5.1.3外部链接所谓外部链接，指的是跳转到当前网站外部，与其它网站中页面或其它元素之间的链接关系。这种链接的URL地址一般要用绝对路径（以http://、ftp://等开头），要有完整的URL地址。5.2链接对象5.2.1图片链接基本语法：语法说明：（1）href：用来设置图片链接的页面地址URL。（2）target：用来设置目标窗口的打开方式。（3）