网页中设置锚点链接

一、预习与质疑（课前完成）

预习目标：

了解网页的锚点链接的内容，包括外部锚点链接，内部锚点链接等等。

 

• 学习目标

(1) 理解锚点链接的含义和作用（重点）

(2) 学会制作同一页面的锚点链接

(3) 学会制作不同页面间的锚点链接（难点）

(4) 实操：小组合作学习--制作“世界博览会”页面，并设置相关链接。

            

三、项目教学：“世界博览会”链接页面完成图

 

 

 

四、教学过程

   1．导入环节：

长页面中的(跳到页首，转到页尾)

 

页面有目录，点击目录的某一项，直接跳转到自己感兴趣的内容。

 

 

 

完成“学习目标一”

 2．知识点讲授环节：

 

(1)设置锚点链接

锚点：Anchor

含义：指向页面不同位置的链接点。

通俗：为页面的各个位置起名字。

 

  (2) 设置锚点链接两个步骤：

1 创建命名锚点(起名字)。

2 创建到命名锚点的链接(叫名字)。

过程就是：起名字   叫名字

 

 

 

 

完成“学习目标二”

(3) 如何设置本页面的锚点链接：

 

         制作“转到页首”和“转到页尾”

起名字：a      

叫名字:#a       

 

 

 

完成“学习目标三”

 

 

 

（4）如何设置不同页面间的锚点链接

起名字：a     

 叫名字: 网页名#a  

 

3．实操环节：(小组合作研讨题)

 

 

完成“学习目标四”

要求：

 

1. 点击导航可以跳转到相应内容
2. “转到页首”和“转到页尾”可以完成相应功能

 

小组合作学习方式共同完成“中国美术学院美术馆”页面：                                                               

 将学生四个人分成一个小组：

1. 一个人负责整个页面的设计
2. 两个人负责页面的制作
3. 最后一个学生负责对网页进行讲解

       小组合作探究共同学习

 

4．作品评价环节

标准：

1. 功能性评价：完成“网页”功能(50分)

(2) 感观性评价：作品美观大方，配色和谐 (25分)

(3) 网页布局评价：排版布局完美，切合网页实际，界面友好(25分)

额外加分项目：创意加分（10分）

 

5．评出优胜组

  获胜组为：_______  恭喜他们！

 

6. 教师讲评  布置作业

用dreamweaver制作文件夹中课下练习的内容，要求添加：

1. 转到页首
2. 转到页尾
3. “美术学院美术馆页面”和“网上展厅”页面间跳转。