发布时间 : 星期六 文章《网页制作》项目式教案 - 图文更新完毕开始阅读1395aa8aa1116c175f0e7cd184254b35eefd1a07
任务二 编辑文本样式
一、提出任务
1．任务目标
完成首页文本样式设置，添加水平分隔线与列表。 2. 解决的问题
本任务通过设置首页文本样式，学习文本样式设置与应用，修改文本样式，添加水平分隔线与列表知识。
3. 本任务所涉及原有知识要点
完成本任务所涉及原有知识要点有：输入文本内容的方法，段内换行与划分段落方法，输入连续空格的方法。
二、教学目标
1. 知识目标
⑴ 掌握文本样式设置与应用。 ⑵ 掌握修改文本样式。 ⑶ 掌握重命名文本样式。
⑷ 掌握添加水平分隔线与列表。 2. 能力目标
能够根据具体需求进行文本各种属性及样式的编辑与设置，并提高学生自主学习、协作学习和知识迁移的能力。 3. 情感目标
通过教师引导学生主动参与学习，使学生学会使用探求性学习方法获取新知识，激发学习本课程的兴趣，增强学好本课程的信心。
三、教学分析与准备
1. 教学重点
⑴ 文本样式的设置、应用及修改。 ⑵ 添加水平分隔线与列表。 2．教学难点
文本样式的设置、应用及修改。 3. 教学方法
任务驱动学习、协作学习和探究学习相结合 4. 课时安排
4课时。 5. 教学环境
多媒体网络教室
四、教学过程（组织课堂、复习知识、教师引领完成任务占2学时；举一反三占2学
时。） 教学环节及手段 组织课堂 复习知识
教学内容 集中学生注意力，准备上课。 指定学生上前操作，考察对添加文本内容及划分行与段落的掌握情况。 在指定站点内新建一个网页，将事先输入的两首诗（没做任何格式设置）复制过来，要求学备注 通过指定学生上前演示，复习与本任务有关的知9
任务流程 导入任务 分析任务 演示本任务生通过插入空格、分行与分段操作，使页面外观美观。最后，预览网页。 在开始新的课程学习之前，先来了解一下，为什么要为网页设置文本样式及设置哪些文本样式。 通过浏览网站，引导学生明白文本字体、字号、颜色、加粗、倾斜及对齐方式等文本样式的设置是必需的，那么，如何完成文本样式的设置与编辑呢？ 提出任务：完成首页文本样式设置，为首页添加水平分隔线与列表。 可以直接通过属性面板设置指定文本的样式，也可以其他文本位置应用该样式，但样式的修改需要在CSS样式面板中进行。 可以通过制作列表，添加水平线来编辑网页的外观。 1．文本样式设置与应用 ⑴ 为网页中第一行文字“幽幽我心的个人网站”设置文本样式 回忆Word文本格式设置的设置步骤：首先选中相应文本；接着通过格式工具栏进行设置。 网页制作也类似，首先要选中相应文本，接着通过文本属性面板完成设置。 演示设置过程，强调：文本属性设置一气呵成的重要性以及反复选中修改属性的弊端。 简介文本属性面板各部分及其功能，讲解为“字体”列表项添加字体的方法。 为网页中第二段标题文字“自我介绍”设置文本样式。 ⑵ 为标题文字“青春寄语”、“立志飞翔”，应用样式（为“自我介绍”设置的样式） ２．样式重命名 引导学生观察并总结出样式默认命名形式为STYLE+N。一个网页中可能会定义许多样式，而这些样式不一定全是文本类型的，为了方便使用样式，最好对样式进行重命名，使名称能表示样式含义。 演示为“幽幽我心的个人网站”中的文本样完成效果，教师分析。 完成任务
识。 力求通过任务导入，吸引学生学习兴趣。 引入课题。 教师讲解为主。 大多数学生都有编辑Word格式的经验，引导学生将Word格式设置中的经验迁移过来，加深学习的印象。 10
单击“样式”列表旁的按钮，打开 “CSS样式”面板。对样式“title2”进行编辑， 在面板当中修改颜色值为“#FF6600”。让学生观 察应用了“title2”样式的文本颜色是否会发生 相应的变化。 ４．插入列表与水平线 知识总结 选中“自我介绍”部分的文本内容，选择“属 性”面板中的“项目列表”，为选中文本插入项目 列表。 教师启发思 将光标插入到“青春寄语”标题之前，将“插路，学生自己动手举一反三 入”栏切换到“HTML”类别，选择其中的“水平完成。 线”按钮，在“自我介绍”内容和“青春寄语” 内容之间插入一条水平线，起到分隔的作用。 任务目标 通过完成本任务学习了文本样式设置与应用，修 改文本样式，添加水平分隔线与列表知识，设置 文本样式时最好一气呵成。 启发思路 依据前面学习的知识与掌握的专业技能，引 提醒学生使用导学生完成类似的任务，教师作为组织者和引导帮助功能找到答分组完成任务 者，着重启发学生寻找完成任务的思路，养成利案。 用“书籍”、“帮助”、“网络”等自学的好习惯。 学生自评或互评 将本单元素材“举一反三”文件夹中的网页 “practice2-3.html”拷贝到D:\\mysite目录下， 给页面中的每一段文字设置一种不同的文本样 教师点评总结 式。 要设置各部分文字样式首先做什么，接下来通过 什么面板进行设置；要做到标题醒目，各段样式 不同但风格要一致。 布置作业 式重命名的方法，并按照课本P37页表格要求，设置“青春寄语”与“立志飞翔”中的文本样式并重命名。 ３．修改文本样式 提出如何修改文本样式让学生思考，学生们可能有说通过属性面板修改样式的，教师可以演示通过属性面板不能修改样式。 演示修改title2样式：
11
把不同层次的学生分在一组中，鼓励同学积极讨论完成任务。 组织不同组的同学互相评论对方完成任务的优缺点。 教师对每组同学完成任务情况进行总结，对完成任务的表扬，对没有完成任务的鼓励，并帮助他们分析没有完成的原因。可以根据每组任务完成情况结合自评与互评情况给出每组的成绩。 1．新建一个网页“practice2-4.html”，插入5条水平线，使用属性面板进行不同的宽、高、对齐与阴影属性设置，预览页面并比较不同属性的设置效果。 2.新建“班级荣誉”页面，文件名为“practice2-5.html”，列举班级成员所获奖励，设置为编号列表，修改文本样式，用不同的文本大小、颜色区分奖励的等级，保存并预览页面。尝试先设文本样式后设编号列表有何区别。（要求各组课下搜集班级成员获奖情况，并制定一个设置方案）
12