使用图片修饰网页

1 第二十五课第二十五课 使用图片修饰网页使用图片修饰网页 一 教学目标一 教学目标 知识方面 1 使学生掌握在网页中插入图片的方法 2 使学生掌握设置网页背景的方法 3 使学生初步了解网页图片文件 技能方面 1 培养学生处理图片的能力 2 培养学生的观察能力 情感方面 1 培养学生审美能力 2 培养学生合作学习的意识和能力 二 教学重点二 教学重点 在网页中插入图片的方法 三 教学难点三 教学难点 如何在网页上插入图片 四 教学方法四 教学方法 1 演示法 2 实践法 3 自学法 五 教学手段与教学媒体五 教学手段与教学媒体 多媒体网络教室 六 课时安排 1 课时 七 教学过程七 教学过程 见下表见下表 一 导入课题一 导入课题 教师展示学生制作的网页 上节课的作业 提出怎样 美化网页的问题 由此引入 课题 二 新课二 新课 教师介绍 网页一般支持 两种图片文件格式 即 GIF 格式和 JPG 格式 其中 JPG 格式是一种应用较广泛 的压缩格式 它的最大特点 是文件较短小 GIF 格式既 可以是普通的图片 也可以 是一些小动画 图标 由于 网络速度等原因 在网页中 插入的图片文件不宜过大 学生欣赏同学制作的网页 考虑教师提出的问题 学生听教师介绍 学生明确本课学习任务 学生了解网页中图片文件 的基本格式和选择图片文件 不要太大的原因 2 1 插入图片 例 1 在 index html 网页中 添加动画图片 教师讲解和演示操作步骤 1 打开 index html 文件 2 将插入光标移动到需要 插入图片的位置 3 单击工具栏中的插入图 片按钮 打开 图片 对话 框 4 单击对话框中的选择图 片文件按钮 打开 选择文 件 对话框 5 选择需要插入的图片文 件 单击 确定 按钮 6 单击工具栏中的 保存 按钮 选择文件保存的位置 7 单击 确定 按钮 教师提示 如果插入图片 的大小和位置不合适 可以 适当地进行调整 调整方法 和 Word 中图片的调整方法 相同 学生观察教师操作 学生听教师介绍 学生了解在网页中插入图 片的基本方法 学生明确在网页中调整图片 大小和位置的方法与 Word 相同 续表 教师布置任务 在自己的 网页中添加图片 并进行适 当调整和修饰 2 设置网页背景 例 2 将 jieshao htm 网页的 背景设置为自己喜欢的颜色 教师讲解和演示操作步骤 1 打开网页文件 jieshao htm 2 在网页编辑区单击鼠标 右键 打开快捷菜单 3 单击快捷菜单中的 网 页属性 命令 打开 网页 学生上机实践 在网页中 插入图片 学生观察教师操作 学生可以完成在网页中添 加图片的任务 学生了解在网页中插入背 景颜色的方法 3 属性 对话框 4 单击对话框中的 背景 标签 5 在 背景颜色 下拉列 表框中选择一种颜色 6 单击 确定 按钮 教师布置任务 给 jieshao htm 网页设置背景颜 色 例 3 给 index html 网页添 加背景图片 教师布置任务 自学给网 页添加背景图片的方法 完 成例 3 教师指定学生讲解并演示 操作方法 1 在 index html 网页编辑 区单击鼠标右键 打开快捷 菜单 学生上机实践 给网页设 置背景颜色 学生上机实践 自学给网 页添加背景图片的方法 学生演示给网页添加背景 图片的方法 学生可以完成任务 学生学习了插入图片和设置 网页背景颜色的知识 通过 思考和实践 学生可以掌握 给网页添加背景图片的方法 并完成例 3 通过学生演示 纠正学生 操作中的错误 使全体学生 进一步掌握给网页添加背景 图片的方法 续表 2 单击快捷菜单中的 网 页属性 命令 打开网页属 性对话框 3 单击对话框中的 背景 标签 4 单击选择对话框中的 背景图片 选项 5 单击 浏览 按钮 打 开 选择背景图片 对话框 6 选择一张合适的背景图 片 7 单击 确定 按钮 三 课堂练习三 课堂练习 给自己的网页插入图片并 设置背景图片 四 课堂小结四 课堂小结 师生共同小结所学知识 强 调在网页中插入图片 背景 的方法与 Word 大致相同 五 布置作业五 布置作业 学生进行课堂练习 学生参加小结 学生可以完成课堂练习 复习巩固所学知识 建立 新旧知识的联系 培养学生的审美能力 4 使用图片修饰自己的网页 八 板书八 板书 第二十五课第二十五课 使用图片修饰网页使用图片修饰网页 一 插入图片 单击 插入图片 选择图片 单击 确定 单击 保存 选择图片保存位置 单击 保存