当前位置:首页 >> 其它课程 >>

12 用表格为网页布局


广陈中学 2015 学年第一学期八年级信息技术教案

参悟稿:12 用表格为网页布局
主备: 审核:上课日期总第 课时

教学 目标

1. 通过分析不同的页面布局,理解布局在版面设计中的重要性。 2. 利用表格规划网页布局,掌握表格的插入、设置等操作方法。 用表格布局网页。 灵活掌握排列表格和设置表格属性的方

法。 教授式学习;任务驱动法; 教学过程 教具准备 范例

教学重点 教学难点 教学方法

教学环节

教师

学生

设计意图 通过提问、引导、比 较等方法,培养学生 辨别表格布局网页页 面的好处。

一、导入

展示 2 张素材相同布局不同的网页。 学生观察和比较 提问①: 哪张比较美观?对照课本图 12-1 两张网页,个别 至 12-4 常见网站主页构成图, 它属于哪种 回答问题。 类型?②:它是怎么布局的?教师分析网 页中所隐含的表格结构,总结用表格为网 页布局的重要性。 分析网页中所隐 含的表格结构, 并回答。

1、提问:这张网页是用几行几列的 表格布局的? 二、 析表格 教师展示表格结构。 布局 2、展示“网络世界”网站主页,让 学生分析表格结构。 任务一:打开自己的网站主页,设置 三、 设置网 网页大小。一起学习“日积月累” 。 页大小

通过提问、比较、学 生回答,教师示范演 示等方法,提高学生 如何利用表格布局网 页页面的能力。 培养自主学习的能力

学生读读“日积 月累” , 查找一下 自己屏幕的分辨 率。

任务二:根据自己的网站主页设计, 插入及编辑表格 插入表格。 并完成页面布局 个别学生演示插入表格。任务③对表 四、 插入及 格进行拆分,调整单元格。教师演示,并 编辑表格 作页面布局。 并完成页 面布局 提高任务:完成之前操作的学生确定 标题栏目和分栏目,并在主页中插入图片 部分学生完成 和文字。 展示个别学生的成果,并分析成功和 六、 课堂展 欠缺的地方。 示 学生分析,教师 总结

学生在制作过程中的合 作、讨论、展示、交流、 评价及归纳等方法,培养 学生的思考能力、语言组 织能力、语言表达能力、 归纳能力和审美能力。 提高任务让一部分学生 体会整体网页制作的过 程。 培养学生重视学习结果 的质量,并从中让他们获 得成功的体验。激发学习 网页制作的兴趣。


相关文章:
实训六 利用表格进行网页布局
实训六 利用表格进行网页布局课时: 3 班级: 计算机班 12 一、实训目的 实训日期: 2013-4-2 编写时期: 2013-3-29 1、了解网页设计常用的几种版式; 2、掌握...
用表格布局网页教案_图文
课题 用表格布局网页(一) 本节课是网页制作的第五节内容,在此之前,学生已经...2. 探索中发现 适的任务 新的问题 时间(分) 12 分钟 教学过程(二)制作正文...
项目二 使用表格布局页面(12)
详​细​介​绍​ ​表​格​布​局​ ​ ​欢​迎​下​载项目二 使用表格布局页面表格是制作网页的灵魂,在实际应用中,表格排版的地位...
第三章 使用表格规划网页布局
第三章 使用表格规划网页布局_计算机软件及应用_IT/计算机_专业资料。第三章 使用...3、占位符: 当我们插入表格后,每个单元格的默认的高度是 12 像素的,但这些...
应用表格布局网页结构
[ 作者:阜宁县明达中学 姜秀菊 1078 更新时间:2010-6-12 来源:本站原创 ...过程与方法目标: 1、利用对比学习,形成知识迁移的能力 2、通过用表格布局网页,...
实验二 使用表格布局页面
实验二 使用表格布局页面_互联网_IT/计算机_专业资料。实验二 使用表格布局页面...12.设置链接颜色为#FFFFFF,即白色。 13.在表格 3 的下面插入一个 1 行 3...
4.1用表格布局网页教案
4.1用表格布局网页教案_中职中专_职业教育_教育专区。§4.1 利用表格布局页面胡 ...文档贡献者 lakeice0574 贡献于2015-12-24 相关文档推荐 暂无相关推荐文档 ...
实验15 利用表格和框架技术进行网页布局设计
图 15-12 表格网页布局首页设计图 将主页的内容区替换为“个人简介”页面内容,并将网页另存为 introduction.html。 将主页的内容区替换为“我的学校”页面内容,...
实验三 使用表格布局页面_图文
实验三 使用表格布局页面浏览器显示效果图: 一、 实验目的:利用表格布局页面, ...文档贡献者 zyzhangyaozy 贡献于2015-12-24 相关文档推荐 暂无相关推荐文档 ...
表格及页面布局
表格页面布局_计算机软件及应用_IT/计算机_专业资料。表格页面布局实验...12. 设计另一个网页,网页效果图。 13. 用超链接将两者链接起来 14. 浏览...
更多相关标签:
网页设计表格布局例子 | 表格布局网页 | 表格布局网页模板 | 利用表格布局网页 | 网页制作表格布局 | html网页表格布局实例 | 应用表格布局网页结构 | 用表格布局网页 |