用表格进行页面布局教案_图文

省淳中信息技术深度研课教学设计
【课题】 用表格进行页面布局 【课程标准】 1. 理解 WWW、网页、主页、网站的基本概念及其相互关系。 2. 理解动态网页的概念,了解其工作过程。 3. 能够使用常用的网页制作软件进行动态网页的制作与发布。 4. 通过开发实践,学会简单网站的规划、设计、制作、发布与管理的基本方法。 5. 能够根据网站主题要求设计评价指标并对常见网站的建设质量与运行状况进行评 价。 【学业水平测试内容和要求】 1. 了解 WWW、网页、主页、网站的概念及区别。 2. 了解什么是静态网页和动态网页。 3. 了解动态 HTML 技术和服务器端动态网页技术的基本知识。 4. 了解网站开发的一般过程。 5. 知道网站规划主要包含的内容,学会根据需求规划网站。 6. 学会使用一种常用的网页制作软件制作网站,包括建立站点、新建网页、利用表格 布局网页、修饰文字、插入多媒体信息、建立超级链接、制作简单的网页动态效果 等。 7. 了解如何在局域网或因特网上申请网站空间,发布网站。 8. 了解简单维护网站的方法。 9. 了解网站评价的几个主要方面,能使用评价量表进行网站评价。 【学情分析】 网络技术应用是普通高中信息技术选修模块。计算机网络的出现改变了人们的生活方 式,对人类产生了深远的影响,网络技术的学习将帮助学生更好地合理地去使用它。课时安 排为 7 课时,本节教学设计为第 1 课时。 大部分学生小学或初中有了一定的计算机基础, 掌握了计算机的基本操作技能, 能够使 用一些常用软件,并且对网络有一定的了解,但是也有个别零起点学生。因此,在教学中要 兼顾到不同层次的学生。这一章在学业水平测试中要求较高,要求学生理解并能独立操作、 迁移应用与熟练操作。所以,在课时安排上有所侧重,在教学设计中也要着重锻炼学生的操 作能力。 【学习目标】 1. 通过学生网页与示例网页的对比,引导学生发现及归纳其差异:文字与图片位置合 理,确定问题,即需要对网页进行页面布局。 2. 通过阅读材料和自主探究,归纳和总结网页布局的形式和方法。 3. 通过分析示例网页,找出解决上一问题的方法之一,即用表格进行页面布局。 4. 通过学生自主探究,掌握表格的建立、边框粗细的设置、宽度高度的设置、单元格 的合并与拆分。 5. 通过网页、表格、单元格的背景色设置,让学生在操作中发现并总结出网页、表格、

单元格的应用范围不同,优先级为单元格>表格>网页。 6. 通过完成学习任务: “圣诞节”首页面的制作,学会自主设计页面布局并理解表格 在页面布局中所起的重要作用。 【学习重点】 表格的使用 【学习难点】 自主设计网页的布局并利用表格实现 【学习过程】 一、导入 学生对比观察两张网页:上节课的学生作品、示例作品,说说其差异?哪个网页更好? 好在哪里? ->引出页面布局的概念 二、新授 【自主探究活动 1】如何进行页面布局? 观察班级主页的页面布局,分析其布局特点: 网页布局常用方法有三种:纯表格布局、DIV+CSS 布局、框架布局; ->引出 FrontPage 中页面布局的工具——表格 ->表格的作用:在网页制作中网页表格功能不仅仅是组织数据,更多地被用来进行页 面布局

->表格布局的形式(部分示例)

【活动小结】 页面布局的形式:

页面布局的方法: 【自主探究活动 2】如何使用表格? (1)表格的建立: 通过“表格”菜单、常用工具栏中的“插入表格”按钮在页面中建立表格 (2)单元格的合并与拆分: (3)表格属性的设置: 表格大小:表格的高度、宽度(注意区分像素、百分比) 对齐方式:左对齐、右对齐、水平居中、两端对齐 背景:背景图片、背景颜色 边框:粗细、颜色 (4)单元格属性的设置: 单元格大小:单元格的高度、宽度(注意区分像素、百分比) 对齐方式:分为水平对齐、垂直对齐 背景:背景图片、背景颜色 边框:颜色 【活动小结】 :表格的相关操作 【自主活动 3】网页、表格、单元格的优先级? 通过网页、表格、单元格的背景色设置,发现并总结出网页、表格、单元格的应用范 围不同,优先级为:单元格>表格>网页。 【活动小结】优先级为:单元格>表格>网页 三、 【活动任务】 (1)利用表格自主设计“圣诞节”网站首页面。 (自建站点) (2)在网页相应位置添加文字及图片素材(素材不要求全部使用,自选素材) 。 (3)保存网页。 参考样张(不要求与样张一致) :

四、作品展示 自评:1、简述设计的想法;2、优缺点 他评:优缺点,以及改进意见 教师评价:1、优缺点;2、针对优缺点给建议

五、总结 页面布局的常用方法:表格 布局方式 时间有剩余的话让学生修改自己的网页并提交。 【教学反思】


相关文档

用表格布局网页教案
教案12 应用表格布局网页
表格布局网页教案
第十五课 用表格为网页布局 教案
第12课《用表格为网页布局》教案
4.1用表格布局网页教案
《用表格布局网页》参考教案
应用表格布局网页教案设计与反思
使用布局表格进行网页布局
利用表格进行页面布局
电脑版