力求通过任务通过完成一个任务，启发学生思考完成任务的方法，讲授必要的知识，传授必要的技能。 导入，吸引学生学1．展示一个图文页面，让学生描述在设计视图习兴趣。 下的制作流程。 2．让学生讨论上面复习知识的第2个问题，如 果要求使用HTML代码来完成这个操作，该如何实 现？ 由以上两个问题引出本课课题。 提出任务：使用代码制作图文网页 任务提出后的使用HTML代码在网页中插入文本和图像，并进分析过程可以先由行简单的属性设置，了解相应标签的使用方法、插入学生讨论，再由教位置和基本属性。 师总结。 完成任务 1．知识讲解 知识讲解 ⑴ 在使用HTML语言制作网页过程中，首先要设 教师引导，置网页的标题标签。如下所示： 标 签 描 述 学生讨论、分析。
?
??????段落标签????????水平线标 签 ⑶ 列表标签分为两种形式而列表项标签是相同 的，如下所示： 标 签 描 述 ???????项目列表标签
- ?
21
任务流程 导入任务 分析任务
⑷ 使用CSS。 使用代码定义CSS样式并将其应用到段落标签 中。 通过本任务主要学习了使用代码在网页中插入培养学生自主文本、图像、列表、水平线，并设置相应属性。 学习、探究学习的 能力。 将本单元素材 “举一反三”文件夹中的网页 “practice2-12.html”拷贝到D盘根目录下，使用启发思路 标签代码制作项目列表，并比较与编号列 表的区别。 项目列表标签与编号列表标签的区别在于列表分组完成任务 的浏览效果不同，使用方法是相同的，所以两种列表 中的列表项都是使用标签。 学生自评或互评 学生分组上机，在组内进行讨论交流，最终完成 教师点评总结 任务。 由各组学生代表来分析说明本组完成情况。 布置作业 指出学生在总结时可能出现的错误，补充不足， 鼓励学生学习使用HTML代码制作网页的信心。 将本单元素材 “举一反三”文件夹中的网页“practice2-13.html”拷贝到D盘根目录下，在“代码”视图下定义样式“txt”，设置字体样式为大小18像素，颜色为“#662244”，将这一样式应用到页面中的所有段落标签中，在任一位置插入本单元素材“举一反三”文件夹中的图像“jyfs4.jpg”，使用代码设置图像的对齐方式，完成后预览页面。
知识总结 举一反三 任务目标
22
项目三 制作“作品展示”网页
本项目通过“创建表格”、“编辑表格”、“添加表格内容”和“建立超级链接”四个任务，完成“幽幽我心的个人网站”中的“作品展示”网页的制作，学习如何使用表格来进行网页的布局。任务完成后效果如图所示：
本项具体的教学过程共分为以下五个方面的任务： 任务一 创建表格 （4课时） 任务二 编辑表格 （4课时） 任务三 添加表格内容 （4课时） 任务四 建立超级链接 （6课时） 任务五 使用代码制作表格网页 （6课时）
23
任务一 创建表格
一、提出任务
1．任务目标
完成“作品展示”网页中表格的创建。 2．解决的问题
通过在“作品展示”网页中创建表格理解表格布局页面的重要性，学习网页的布局分析，掌握创建表格的几种方法。 3．本任务所涉及原有知识要点
完成本任务所涉及原有知识要点有：在页面添加文本，设置文本格式，插入图像，设置图像格式。
二、教学目标
1. 知识目标
⑴ 理解表格在网页设计中的作用。 ⑵ 掌握利用表格布局页面。 ⑶ 掌握创建表格的基本方法。 ⑷ 掌握创建嵌套表格。
⑸ 掌握在网页中利用表格进行排版。 2. 能力目标
掌握表的创建和编辑，能够根据具体需求灵活应用表格，并能利用表格进行页面布局和排版。
3. 情感目标
⑴ 通过参与作品评价，提高学生的审美能力与鉴别能力。
⑵ 鼓励学生根据任务需求进行科学合理的设计，提高学生分析问题与解决问题能力。
三、教学分析与准备
1. 教学重点
⑴ 理解表格在网页设计中的作用。 ⑵ 分析页面的表格布局。 ⑶ 创建表格的基本方法。 2．教学难点
⑴ 分析页面的表格布局。 ⑵ 创建嵌套表格。 3. 教学方法
任务驱动学习、协作学习、探究拓展学习与举一反三相结合。 4. 课时安排
4课时。 5. 教学环境
多媒体网络教室。
四、学习过程（组织课堂、复习知识、教师引领完成任务占2学时，举一反三占2学时。） 教学环节及手段 组织课堂 复习提问
教学内容 集中学生注意力，准备上课。 通过提问考察学生对插入图像基础知识的了解。 备注 学生回答，24
任务流程 导入任务 分析任务 完成任务 分析网页布局 如何在网页上插入一张图片，并调整图片的大小、教师按照步骤操作。 位置？ 学生展开 学生分组讨论如何在网页上制作一个班级通讯录，讨论 每行内容有“姓名、照片、地址、联系电话”。 通过上面讨论，引导学生认识利用表格制作通讯录 是方便快捷的方式，再引导学生联想生活中用到的表 格，进而了解表格在网页制作中的广泛应用。 在Dreamweaver 8中，表格是用于在页面上显示表 格式数据及对文本和图像等元素进行布局的强用力的 工具。本任务将学习在网页制作中如何灵活运用表格。 提出任务：利用表格规划、布局作品展示网页。 教师展示 依据设计图样，可以使用四个表格把页面划分为四“作品展示”网个区域，四个表格分别命名为“table1”、“table2”、页成品 “table3”和“table4”。依据不同的设计内容，这四 个表格还需要进行相应的编辑与嵌套。 PPT给出课 本图3-1页面布1．分析网页布局 ⑴ 见课本图3-2，教师带领学生进行页面表格分局及课本图3-2 析。 引导学生了解：“table1”是一个2行1列的表格。 第一行用于放置网站标题及图像，第二行嵌套一个1行 5列的表格“table1-1”，用于放置五个导航按钮。 “table2”是一个1行4列的表格。左右单元格为 空白区域，中间两个单元格分别用于放置“作品展示” 和“友情链接”两张图像。 “table3”是一个1行3列的表格。左右单元格为 空白区域，中间单元格用于放置作品分类标题和图像。 在中间单元格嵌套一个6行1列的表格“table3-1”。 “table3-1”表格的每一行再嵌套一个表格，其中第 一、三、五行分别嵌套一个1行2列的表格，用于放置 图标及作品题目；第二、四、六行分别嵌套一个1行5 列的表格，放置三幅作品及左右两个空白区域。 “table4”是一个3行1列的表格，第一行是空白 区域，第二行通过设置行属性显示为一条细线，第三行 放置版权信息。 重点理解如下内容： ａ．课本图3-1页面布局由4个大表格组成，分别 分析每个表格的作用。 让学生积b．什么是嵌套表格（插入嵌套表格是指在表格的极讨论实际例单元格中插入新的表格。）和嵌套表格的作用。 ⑵ 教师举一些网页布局的实际例子让学生进行协子的布局结构，同分析。总结：通过以上几个实际网站页面的例子，介教师归纳总结。 25