正在加载数据...

最新推荐

  • 暂无资料

热点排行

  • 暂无资料
扫码可在移动端浏览

网页中设置锚点链接

作者:梁爽 来源:点击数: 发布时间:2019年04月10日

一、预习与质疑(课前完成)

预习目标:

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

 

  • 学习目标

(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. “美术学院美术馆页面”和“网上展厅”页面间跳转。

 

 

收藏 打印文章