任务四 使用代码制作“异国风情”网页 一、提出任务 1．任务目标 使用HTML代码制作一个“异国风情”网页。 2. 解决的问题 通过完成本任务，学习使用HTML代码在网页中添加层和热点。 3. 本任务所涉及原有知识要点 完成本任务所涉及原有知识要点有：在设计视图中使用“行为”面板添加层和热点，在代码视图中使用HTML代码添加图像和链接。 二、教学目标 1. 知识目标 ⑴ 掌握使用HTML代码插入图像和层。 ⑵ 掌握使用HTML代码给图像添加热点。 ⑶ 掌握使用HTML代码为热点添加行为。 ⑷ 熟悉
标签的使用方法。 ⑸ 熟悉
标签的使用方法。 2. 能力目标 能够使用HTML代码制作网页动态效果，并学会使用HTML代码添加图像与层、添加热点和行为。 3. 情感目标 培养学生勤于探索、主动学习的意识，树立将来成为网页制作专业技术人员的信心。 三、教学分析与准备 1. 教学重点 ⑴ 使用HTML代码插入图像和层。 ⑵ 使用HTML代码给图像添加热点。 ⑶ 使用HTML代码为热点添加行为。 2．教学难点 ⑴ 使用HTML代码添加热点。 ⑵ 使用HTML代码为热点添加行为。 3. 教学方法 任务引领学习、自主学习、协作学习和探究学习相结合，通过几种教学方法的运用，不仅让学生掌握相关知识，同时提高学生的学习能力。 4. 课时安排 4课时。 5. 教学环境 多媒体网络教室。 四、教学过程（组织课堂、复习知识、教师引领完成任务占2学时；举一反三占2学时。） 教学环节及手段 教师活动 学生活动 组织课堂 复习知识 任务流程 导入任务 分析任务 完成任务 知识讲解 教师引导，学生讨论、分析。 知识总结 举一反三 任务目标 启发思路 分组完成任务 学生自评或互评 教师点评总结 布置作业 集中学生注意力，准备上课。 通过指定学生上前操作下题考察学生对已学HTML代码的掌握情况。 1．使用HTML代码创建一个空白网页文件，修改页面的背景颜色，并添加一副图片。 展示“唐诗赏析”网页，让学生描述在设计视图下的制作流程。 让学生讨论上题，如果要求使用HTML代码来完成该如何实现？ 提出任务：使用HTML代码编写网页，当单击导航图像中不同文字时，在网页中显示不同的内容。 网页由上下两部分组成，上半部分添加用于导航的文字图像，下半部分显示文字对应的风景图像。这些风景图像分别放在不同的层中，这些层重叠在相同位置，并且大小相同。通过为上半部分导航图像上的文字添加三个矩形热点、把热点链接到一段JavaScript代码，该代码功能为调用ShowDiv函数，该函数控制层的显示与隐藏，实现各热点的行为。 1．知识讲解 ⑴ 添加热点标签语句格式
“area”标签用于设置热点。HTML中
标签没有结束标志，而且这个元素总是嵌套在
