建立超链接

课题：建立网页超链接

【学习目标】

知识目标：掌握文本链接、图像链接、邮箱链接、同一页面内的链接的操作

能力目标：通过具体的实践操作，培养学生的动手能力和语言表达能力，培养学生的探索性学习和创新能力

情感目标：进一步加强他们的信息素养，培养团队协作精神。

【学习重点】文本的链接

【学习难点】同一页面内的链接

【课时】2课时

【教学手段】网络机房、多媒体辅助教学。

【教学方法】（1）问题探究学习法，(2) 互动式的教学方法，(3) 分组讨论式学习

【授课者】陈林

【授课过程】

一、新课导入

展示本班同学制作的《环保网站》的几个页面，提出问题：如果我想通过这个主页面要访问到其他的页面，并且还想访问因特网上更多信息，怎么办？从而呈现出本节课的教学任务，如何让自己的网站成为一个名副其实的网站，激发学生的学习兴趣。

二、讲授新课

1、展示已做好的链接，让学生分析超链接语句中包含两个部分内容：即链接锚点对象和链接地址。

2、教师讲授并演示：链接锚点对象

用a来表示锚点，a也源自于英文中的anchor。href属性意思是超文本引用，这个属性的值指定了链接的目标。在一个完整的链接语句中包含2个部分，即链接锚点对象和链接地址。

学生练习：让学生依葫芦画瓢。看看能不能做出来。(启发式教学，培养学生自主分析问题的能力)

3、教师讲授并演示：一般文本链接中，最初文字上的超链接呈蓝色，文字下面有一条下划线，如果超链接已经被浏览过了，文本颜色就会发生改变，默认是紫色。

页面A

教师演示做一个链接，提醒学生注意观察，看谁最认真，看出老师是怎么做的(师生互动，激发学生的学习热情，学生自觉地集中精力观看教师的每一步操作，学习效果更加明显，学生

会将一些基础知识在不知不觉中掌握)。

学生练习：做自己网页的文字链接，并引导学生如何做图像做链接，可以进行小组讨论。（提高学生问题探究的能力和合作能力）。

4、教师讲授并演示：图像链接的使用频率和文本链接一样相当高，设置链接的方法和文本无异，在引用图片的代码前面先放入标签。

学生练习：做自己网页的图像链接，丰富网站的样式。

5、教师讲授并演示：标签不仅能实现网页之间和网页与文件之间的链接，还可以链接到电子邮箱地址。当然，也可以直接在页面中留下电子邮件地址，但是有时候为了突出友好性，而不是直接留下地址，采用将邮箱链接到页面内容上的方式，使用方法如下：

链接锚点对象

“mailto”就是“mail to”的连写，指“把邮件发送到”。

例如：告诉我们你对网页设计的想法?

在这行代码中，给新邮件填好邮件的主题和正文，这样打开电子邮件程序就填好了收信人的新邮件。这通过属性“subject”和“body”来实现，使用的时候有些特别，需要放在两个问号之间。

学生练习：制作一个链接到老师信箱的链接。

6、教师讲授并演示：页面除了和页面之外的文件或者程序链接外，而且也可以和同一页面中的内容进行链接，这种情况通常用于导航，为了是浏览页面的人直接可以跳到自己需要的信息版块上。由于是在同一页面内实现链接，也就是说，页面链接的路径就是在同一页面内，所以在HTML语言中使用标签中的“id”属性来确定路径位置。通过以下两个步骤可以理解这种代码的用法。

（1）要确定链接的锚点对象，不同于页面和外部文件链接的方式在于，链接的路径由于在同一页面内，这里需要使用“#”来引用同一页面中的内容。代码写为：

（2）需要在页面中设定出链接的目标。使用的就是“id”属性。

例：世界博览会的历史与由来

……

学生练习：做一个同页面的链接。

若有学生无法做出相应操作，鼓励其他同学帮助这位同学探索学习(培养学生的协作学习能力)。

三、检查学生练习情况，培养团队协作精神以及学生教学生的能力（贯穿学生练习过程中）

学生练习，教师指导(既进行了情感的深化教育，让学生放松地投入到学习中)。

根据学习情况，聘请做好较好的同学，帮助教师指导同学操作(发挥课堂小助手的作用，发展学生自己教自己的能力，解决教师一人无法照顾大多数学习的不足，让更多的学生能及时得到指导)。

四、课堂情况反馈，教师示范操作巩固

学生操作情况点评、教师小结知识点、教师操作回顾(点评操作中的优点和不足，提出希望，归纳知识点，教师操作回顾，巩固学生所学知识)。

五、布置作业

完成大家之前做的《环保网页》的链接。