网页制作教案第五单元

1、第五章 链接Macromedia Dreamweaver MX提供多种创建超文本链接的方法，可创建到文档、图像、多媒体文件或可下载的链接。可以建立到文档内任意位置的文本或图像（包括标题、列表、表、层或框架中的文本或图像）的链接。若要直观地查看文件是怎样链接在一起的，可使用站点地图。在站点地图中，可以向站点添加新文档、创建和删除文档链接以及检查到相关文件的链接。链接的创建与管理有几种不同的方法。有些Web设计者喜欢在工作时创建一些指向尚未建立的页面或文件的链接；而另一些设计者则倾向于首先创建所有的文件和页面，然后再添加相应的链接。另一种管理链接的方法是创建代替最终文件的【占位符】页面，使用这种方

2、法可以快速添加链接，还可在实际完成所有页面之前对这些链接进行检查。本章重点：了解链接、路径与锚的使用条件掌握链接的设置方法学会使用特殊链接掌握链接目标的指定课时教案 （总第 课时 ）教案内容：课题，教学目标，教学重点、难点、教学流程（教法、学法），板书设计，作业设计，教学反思一、课题创建文字超链接二、教学目标1、了解超链接2、学会建立文本超链接三、教学重点1、超链接简介2、建立文本超链接四、教学难点创建文字超链接五、教学流程（一）导入提问：1、什么是超链接2、怎样创建超链接（二）知识点讲解与操作演示5.1 创建文字超链接5.1.1 超链接简介超链接是WWW技术的核心，是网页中最重要、最根本的元

3、素之一。超链接能够使多个孤立网页之间产生一定的相互联系，从而使单独的网页形成一个有机整体，真正实现网络互连。1.什么是超链接所谓超链接是指从一个网页指向一个目标的链接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片、一个电子邮件地址、一个文件，甚至是一个应用程序。在一个网页中用来超链接的对象，可以是一段文本或一个图片。当浏览者单击已经链接的文字或图片后，锭接目标将显示在浏览器上，可根据目标的类型来打开或运行。按锭接路径的不同，网页中的超链接一般分为3种类型：内部链接、锚点链接和外部链接。按使用对象的不同，网页中的链接又可以分为文本超链接、图像超链接、E-mail链

4、接、锚点链接、多媒体文件链接和空链接等。2.合理安排超链接5.1.2 建立文本超链接在创建超链接之前，首先了解网站中3种类型的文档路径：绝对路径、根目录相对路径以及文档相对路径。绝对路径:是包含服务器协议(对于网页来说,通常是http:/或ftp:/)的完全路径。绝对路径包含精确地址而不用考虑源文件的位置。但是如果目标文件被移动，则链接无效。创建外部超链接时，必须用绝对路径。根目录相对的路径：是从当前站点的根目录开始的路径。站点上所有可公开的文件都存放在站点的根目录下。和根目录相对的路径使用斜杠以告诉服务器从根目录开始。文档相对的路径：是指和当前文档所在的文件夹相对的路径。这种路径通常是最简单

5、的路径，可以用来链接和当前文档处于同一文件夹下的文档。1.创建文本超链接创建文本超链接的操作方法如下：（1）在网页上选择需要添加超链接的文本，此时属性面板成为文本【属性】面板，如图所示。（2）在【属性】面板上指定文本的链接文档，可按以下4种方法指定文本的超链接。方法一：单击【链接】下拉列表框右侧的文件夹，在弹出的【选择文件】对话框中选择链接的目标文件。方法二：在【链接】下拉列表框中直接输入目标的绝对路径。如链接到index.htm文档的效果如图所示。方法三：利用【属性】面板上的【指向文件】按钮，为文字加入超链接。但必须要建立本地站点，且本地站点上还要有文件存在，才能使用此方法。方法四：执行【修

6、改】【创建链接】命令，在打开的【选择文件】对话框中选择被链接的文档。（3）完成链接文档后，可在【目标】下拉列表框中选择目标文件打开方式。【目标】表示所链接的目标文件在浏览器中打开的方式，在其下拉列表框中一共有4个选项，如图所示。blank：将目标文件载入到新的未命名浏览器窗口中。parent：将目标文件载入到父框架集或包含该链接的框架窗口中。self：将目标文件载入与该链接相同的框架或窗口中。top：将目标文件载入到整个浏览器窗口并删除所有框架。设置结束后，在网页中被选择的文字颜色变为蓝色，且在文字底部出现一条下划线，即文字的超链接设置完成，如图所示。2.编辑文本超链接一个未被访问过的链接与一

7、个被激活的链接在形式上肯定会有所区别，链接被访问过了也会发生变化，提示用户这是一个已经点击过的链接，所有这些都是链接的状态。通过设置不同的文本颜色可以使各个状态区别开来。设置文本超链接不同状态文本颜色的操作方法如下：（1）打开包含文本链接的文档，执行【修改】【页面属性】命令，找开【页面属性】面板，如图所示。（2）单击【链接】选项右边的图标，打开调色板，选取一种颜色，作为链接文本的颜色。（3）同样可以为【访问过的链接】和【活动链接】选项设置不同的颜色。（4）完成设置后单击【确定】按钮。（5）按F12键，预览网页，链接的三种状态通过不同的颜色区别开来。3.删除文本超链接在Dreamwwaver M

8、X 中要删除一个文本超链接很容易，先用鼠标选定文本对象，将光标定位于【属性】面板的【链接】文本框中或选中文本框中的链接文档，按下Back Space键或Delete键，将其显示的超链接对象文件名删除，也可选择【修改】【删除链接】命令，删除超链接而保留原文本对象。入sgtive六、学生上机操作练习创建文字超链接七、个别辅导、小结八、教学反思课时教案 （总第 课时 ）教案内容：课题，教学目标，教学重点、难点、教学流程（教法、学法），板书设计，作业设计，教学反思一、课题创建文字超链接二、教学目标5.1.3 实例一三、教学重点1、超链接简介2、建立文本超链接四、教学难点创建文字超链接五、教学流程（一）

9、导入提问：1、什么是超链接2、怎样创建超链接（二）知识点讲解与操作演示5.1.3 实例一入sgtive六、学生上机操作练习实例一七、个别辅导、小结八、教学反思课时教案 （总第 课时 ）教案内容：课题，教学目标，教学重点、难点、教学流程（教法、学法），板书设计，作业设计，教学反思一、课题试题汇编实例一二、教学目标实例一三、教学重点1、学会创建和设置链接2、学会插入命名书签3、学会创建命名书签链接4、学会链接的设置与更改5、学会创建电子邮件链接四、教学难点按要求操作实例一五、教学流程（一）导入复习：1、图像超链接2、文字超链接3、电子邮件链接（二）知识点讲解与操作演示5.1 第1题【操作要求】将D

10、WMXUnit5Y5-01文件夹复制到考生文件夹root文件夹中，重命名为X5-01。把X5-01Y5-01.htm文档重命名为X5-01.htm。打开X5-01X5-01.htm文档，参照【样图5-01】完成下列操作1创建和设置链接：在文档中的“Dreamweaver UltraDev教程”图像处创建与X5-01.htm的链接。2插入命名书签：在X5-01.htm文档右栏“内容区”中，在文本“一、内容简介”、“二、准备工作”、“三、Web应用示例”和“四、拷贝文件”的左边分别插入命名书签，书签的命名依次为X5-01AX5-01D。3创建命名书签链接：分别创建左栏文本“一、内容简介”与右栏命名

11、书签“一、内容简介”处的链接；左栏文本“二、准备工作”与右栏命名书签“二、准备工作”处的链接；左栏文本“三、Web应用示例”与右栏命名书签“三、Web应用示例”处的链接；左栏文本“四、拷贝文件”与右栏命名书签处的链接。4链接的设置与更改：创建右栏中所有文本“返回目录与左栏命名书签“教程目录”处链接，要求“教程目录”命名书签的名称为X5-01E，和“教程目录”的链接，删除原“返回目录”文本中的空链接。5创建电子邮件链接：在“教程目录”栏目下的文本“联系我们”中创建电子邮件链接，电子邮件地址为。将操作结果保存到X5-01文件夹中。入sgtive六、学生上机操作练习实例

12、一七、个别辅导、小结八、教学反思课时教案 （总第 课时 ）教案内容：课题，教学目标，教学重点、难点、教学流程（教法、学法），板书设计，作业设计，教学反思一、课题试题汇编实例二二、教学目标实例二三、教学重点1、学会创建和设置链接2、学会插入命名书签3、学会创建命名书签链接4、学会链接的设置与更改5、学会创建电子邮件链接四、教学难点按要求操作实例二五、教学流程（一）导入复习：1、图像超链接2、文字超链接3、电子邮件链接（二）知识点讲解与操作演示5.2 第2题【操作要求】将DWMXUnit5Y5-02文件夹复制到考生文件夹root文件夹中，重命名为X5-02。把X5-02Y5-02.htm文档重命名

13、为X5-02.htm。打开X5-02X5-02.htm文档，参照【样图5-02】完成下列操作1创建和设置链接：在文档中的“哲学专题”图像处创建与X5-02.htm的链接。2插入命名书签：在X5-02.htm文档右栏“内容区”中，在文本“世界观”、“本体论”、“目的论”、“方法论”、“诡辩论”和“唯我论”的右边分别插入命名书签，书签的命名依次为X5-02AX5-02F。3创建命名书签链接：分别创建左栏文本“世界观”与右栏命名书签“世界观”处的链接；左栏文本“本体论”与右栏命名书签“本体论”处的链接；左栏文本“目的论”与右栏命名书签“目的论”处的链接；左栏文本“方法论”与右栏命名书签处的“方法论”

14、链接；左栏文本“诡辩论”与右栏命名书签处的“诡辩论”链接；左栏文本“唯我论”与右栏命名书签处的“唯我论”链接。4链接的设置与更改：创建右栏中所有文本“返回专题目录”与左栏命名书签“专题目录”处链接，要求“专题目录”命名书签的名称为X5-02E。 5创建电子邮件链接：在文档文本Email中插入电子邮件，电子邮件地址为电子邮件地址为。将操作结果保存到X5-02文件夹中。入sgtive六、学生上机操作练习实例二七、个别辅导、小结八、教学反思课时教案 （总第 课时 ）教案内容：课题，教学目标，教学重点、难点、教学流程（教法、学法），板书设计，作业设计，教学反思一、课题试题

15、汇编实例三二、教学目标实例三三、教学重点1、学会创建和设置链接2、学会插入命名书签3、学会创建命名书签链接4、学会链接的设置与更改5、学会创建电子邮件链接四、教学难点按要求操作实例三五、教学流程（一）导入复习：1、图像超链接2、文字超链接3、电子邮件链接（二）知识点讲解与操作演示5.3 第3题【操作要求】将DWMXUnit5Y5-03文件夹复制到考生文件夹root文件夹中，重命名为X5-03。把X5-03Y5-03.htm文档重命名为X5-03.htm。打开X5-03X5-03.htm文档，参照【样图5-03】完成下列操作1创建和设置链接：在文档中的“友情链接”图像处创建与X5-03.htm的

16、链接。2插入命名书签：在X5-03.htm文档正文中，在蓝色的文本“我的文集”、“我的感受”、“我看品网”、“我的朋友”、“种子”处分别插入命名书签，书签的命名依次为X5-03AX5-03E。3创建命名书签链接：分别创建左栏文本“我的文集”与右栏命名书签“我的文集”处的链接；左栏文本“我的感受”与右栏命名书签“我的感受”处的链接；左栏文本“我看品网”与右栏命名书签“我看品网”处的链接；左栏文本“我的朋友”与右栏命名书签处的“我的朋友”链接；左栏文本“种了”与右栏命名书签处的“种子”链接。4链接的设置与更改：创建右栏中所有文本“返回目录”与左栏命名书签“目录”处链接，其中“目录”命名书签的名称为

17、X5-03F。 5创建电子邮件链接：在“正文”中的文本“请和我联系”中插入电子邮件，电子邮件地址为电子邮件地址为。将操作结果保存到X5-03文件夹中。入sgtive六、学生上机操作练习实例三七、个别辅导、小结八、教学反思课时教案 （总第 课时 ）教案内容：课题，教学目标，教学重点、难点、教学流程（教法、学法），板书设计，作业设计，教学反思一、课题试题汇编实例四二、教学目标实例三三、教学重点1、学会创建和设置链接2、学会插入命名书签3、学会创建命名书签链接4、学会链接的设置与更改5、学会创建电子邮件链接四、教学难点按要求操作实例四五、教学流程（一）导入复习：1、图像

18、超链接2、文字超链接3、电子邮件链接（二）知识点讲解与操作演示5.4 第4题【操作要求】在考生文件夹中创建一个文件夹，命名为X5-04。将DWMXUnit5Y5-04文件夹中所有文档复制到X5-04。把X5-04Y5-04.htm文档重命名为X5-04.htm。打开X5-04X5-04.htm文档，参照【样图5-04】完成下列操作1创建和设置链接：在文档的文本“考古学”处创建与X5-04.htm的链接。2插入命名书签：在X5-04.htm文档正文的“贝丘”、“船棺葬”、“岩画”、“铜镜”、“铜鼓”、“带钩”处分别插入命名书签，书签的命名依次为X5-04AX5-04F。4创建命名书签链接：分别创

19、建上栏文本“贝丘”与正文中命名书签“贝丘”处的链接；分别创建上栏文本“船棺葬”与正文中命名书签“船棺葬”处的链接；分别创建上栏文本“岩画”与正文中命名书签“岩画”处的链接；分别创建上栏文本“铜镜”与正文中命名书签“铜镜”处的链接；分别创建上栏文本“铜鼓”与正文中命名书签“铜鼓”处的链接；分别创建上栏文本“带钩”与正文中命名书签“带钩”处的链接。4链接的设置与更改：创建正文中所有命名书签“返回考古学专题”和“考古学”处的链接，其中“考古学专题”命名书签的名称为X5-04G。 5创建电子邮件链接：在文档结尾处“Email:”中插入电子邮件，电子邮件地址为电子邮件地址为。将操作结果保存到X5-04文件夹中。入sgtive六、学生上机操作练习实例四七、个别辅导、小结八、教学反思课时教案 （总第 课时 ）教案内容：课题，教学目标，教学重点、难点、教学流程（教法、学法），板书设计，作业设计，教学反思一、课题试题汇编实例五二、教学目标实例五三、教学重点1、学会创建和设置链接2、学会插入命名书签3、学会创建命名书签链接4、学会链接的设置与更改5、学会创建电子邮件链接四、教学难点按要求操作实例四五、教学流程（一）导入复习：1、图像超链接2、文字超链接3、电子邮件链接（二）知识点讲解与操作演示5.5 第