教案：使用表格布局网页
教学内容：项目五表格的应用
任务3、使用表格布局网页课程：网页设计与制作
专业：计算机
授课课时： 1课时
教师：
授课班级：
单位：
授课时间：
教学设计说明：对于使用表格布局“个人写真”首页的任务，我在坚持以教
师为主导，学生为主体的教学原则下，通过复习提问——巩固旧知；创设情景——导入新课，明确任务；提出问题——分析任务，引发思考、课堂讨论、获取知识；讲授点拨——任务实施，引出重点；师生互动，归纳提高——攻破难点五个环节进行教学。在任务实施中采取小组合作完成的方法，以小组为整体回答问题及完成操作性任务，小组评比采用星级制，小组得星数量从多到少评为优、良、
D:/myweb素材
2
文本、图片等元素的布局，强调两个网页在制作中的区别是前者运用表格进行合理布局，可见布局在网页制作中的
提出本次课的任二、导入新课
看图观察对比2张网页效果图
图1 图2
【观看效果图】
观看老师展示的
张页面效果图。
【学生感受】
学
网
重要作用。
学
学习任务。
首页效果图
请同学们观察首页的布局，分析
结构，得出首页表
向学生展示首页三、进入新课
1、任务分析
2、任务实施
（一）、插入布局页面的表格并在表格、单元
格属性面板中设置表格
【操作步骤】
步骤1：单击菜单栏[插入记录]/[表格]，设
【学生讨论】
在教师的引导下，
分析、
布局规律。
请学生到教师机上演示表格四的
巡回检查学生制作，并针对制作过程出现问题进
引导学生建立调整表格结构的思
软
教师巡回检查学生制作，并针对制作过程出现问
指置：1*1，边框、边距、间距：0；
步骤2：单击状态栏[table]标签，设置表格
对齐方式为“居中”；
步骤3：单击状态栏[td]标签，设置单元格高；
步骤4：表格2、3、4的创建方法同上。
【提出问题】
如果表格属性填充、间距、边框不设为0是
什么效果？
练习一：带着问题完成表格插入及属性设置
操作。
【总结】如果没有指明单元格边距和单元格
间距，大多数浏览器按单元格边距为1、单元
格间距为2来显示表格。
（二）调整表格结构
1、合并、拆分表格
【操作步骤】
步骤1：光标定位于表格2中，单击单元格属
性面板“拆分”按钮，将单元格差分成10列；
步骤2：按住ctrl键选择不连续单元格，设
置奇数单元格为80px,偶数单元格为20px;
2、表格嵌套
【操作步骤】
光标定位于表格3第二例，插入一个2*3，宽
度80%的表格。
【提出问题】
如何使嵌套的表格置于单元格的最顶端并居
中？
练习二：完成表格的结构调整操作。
【总结】表格中的第二种对齐
单元格中的对象相对该单元格的对齐方式，
在[属性]面板中展开[水平对齐]/[垂直对齐]下
拉列表，选择相应的水平方向和垂直方向的
学生到前面操作，
及
在的普遍问题。
【学生操作】
带
成
设置操作。
总结表格的填充、
间距、
义。
学
整
法，
习操作方法，
WORD
进行对比。
【学生操作】
带
成
联系网站实际应用，让学生理解此布局排版的原
通过新旧知识的综合性应用让学生巩固旧知，同时更好地掌握新对齐方式。
3、归纳提高
网页布局排版的原则:网页布局最好用多个
表格叠加在一起来实现，即网页中有多个表
格从上到下独立的排放。
4、任务拓展
根据首页效果图运用已学知识技能将图片、
文字等对象插入到相应位置。
提示：
在同一个单元格里文字下方还有图片该
如何处理？
整操作。
学生思考，
际，
合理性，
【学生自主练习】
学生自主探究、
主创新，
听老师讲解。
教案：使用表格布局网页
教学内容：项目五表格的应用 任务3、使用表格布局网页课程：网页设计与制作 专业：计算机 授课课时： 1课时 教师： 授课班级： 单位： 授课时间： 教学设计说明：对于使用表格布局“个人写真”首页的任务，我在坚持以教
师为主导，学生为主体的教学原则下，通过复习提问——巩固旧知；创设情景——导入新课，明确任务；提出问题——分析任务，引发思考、课堂讨论、获取知识；讲授点拨——任务实施，引出重点；师生互动，归纳提高——攻破难点五个环节进行教学。在任务实施中采取小组合作完成的方法，以小组为整体回答问题及完成操作性任务，小组评比采用星级制，小组得星数量从多到少评为优、良、
D:/myweb素材 2 文本、图片等元素的布局，强调两个网页在制作中的区别是前者运用表格进行合理布局，可见布局在网页制作中的 提出本次课的任二、导入新课 看图观察对比2张网页效果图 图1 图2 【观看效果图】 观看老师展示的 张页面效果图。 【学生感受】 学 网 重要作用。 学 学习任务。
首页效果图 请同学们观察首页的布局，分析 结构，得出首页表 向学生展示首页三、进入新课 1、任务分析 2、任务实施 （一）、插入布局页面的表格并在表格、单元 格属性面板中设置表格 【操作步骤】 步骤1：单击菜单栏[插入记录]/[表格]，设 【学生讨论】 在教师的引导下， 分析、 布局规律。
请学生到教师机上演示表格四的 巡回检查学生制作，并针对制作过程出现问题进 引导学生建立调整表格结构的思 软 教师巡回检查学生制作，并针对制作过程出现问 指置：1*1，边框、边距、间距：0； 步骤2：单击状态栏[table]标签，设置表格 对齐方式为“居中”； 步骤3：单击状态栏[td]标签，设置单元格高； 步骤4：表格2、3、4的创建方法同上。 【提出问题】 如果表格属性填充、间距、边框不设为0是 什么效果？ 练习一：带着问题完成表格插入及属性设置 操作。 【总结】如果没有指明单元格边距和单元格 间距，大多数浏览器按单元格边距为1、单元 格间距为2来显示表格。 （二）调整表格结构 1、合并、拆分表格 【操作步骤】 步骤1：光标定位于表格2中，单击单元格属 性面板“拆分”按钮，将单元格差分成10列； 步骤2：按住ctrl键选择不连续单元格，设 置奇数单元格为80px,偶数单元格为20px; 2、表格嵌套 【操作步骤】 光标定位于表格3第二例，插入一个2*3，宽 度80%的表格。 【提出问题】 如何使嵌套的表格置于单元格的最顶端并居 中？ 练习二：完成表格的结构调整操作。 【总结】表格中的第二种对齐 单元格中的对象相对该单元格的对齐方式， 在[属性]面板中展开[水平对齐]/[垂直对齐]下 拉列表，选择相应的水平方向和垂直方向的 学生到前面操作， 及 在的普遍问题。 【学生操作】 带 成 设置操作。 总结表格的填充、 间距、 义。 学 整 法， 习操作方法， WORD 进行对比。 【学生操作】 带 成
初中信息技术《网页中的表格》教案
第一单元第三课网页中的表格教 学设计 一、教学目标 1.知识、技能目标： 知识目标：理解表格在网页设计中的重要作用。 技能目标：⑴掌握使用表格布局网页。 ⑵灵活掌握表格调整的方法。 2.过程与方法目标：能够合理利用表格对网页进行布局和规划。 3.情感态度与价值观目标：了解学校概貌，发现校园之美，理解规矩与方圆的关系，养成良好的生活和学习习惯。 本课的重难点：重点和难点：掌握利用表格对网页进行布局的方法课时安排：一课时 教学过程： 一、回顾知识通过打开程序、站点、打开网页、调整图片等操作，复习前两课的内容。 二、导入新课 让同学们欣赏一些有特色的个人网站，引导学生注意网页的设置和布局，引导出本节课的学习内容──网页中的表格。 方法：观察，讨论、思考、回答。 三、自主学习 让学生通过阅读和动手操作的方式，完成以下任务：
任务一：插入表格：师：如果我们想要在网页中使用表格必须先插入表格，操作方法与Word差不多，自己尝试着在一个新网页中插入不同设置的表格，并填写表1-3-1。 学生参照图1-3-4在主页文件Index．htm中插入表格：教师随时观察指导。 任务二：表格的调整：师：此部分内容与Word中的操作也是非常相似，根据教材内容分组完成表格的调整。调整结束后将第二课中已经输入的内容移动到表格中。 对于学生相对熟悉的知识点，完全放手给学生探究完成。尝试通过不同途径解决同一问题，提高学习效率。 三、实践练习 让学生参照课本习题要求，完成练一练部分，让学生练习刚学会的命令。 分组预览网页，看布局的效果。 四、合作探究 分组讨论教材中布局表格命令的用法，使用布局表格命令重新布局网页。 让学生演示后，教师点拨需要注意的问题。 分组展示操作步骤及预览网页。审视自己的网页与其他小组的区别，查找自己的不足。 五、大显身手 仿照第一课中的三个页面，进行布局设计，插入相关素材，完成网页的设计。 每小组选择最优秀的作品，进行展示评比，选出最优秀的作品。 六、教学总结
用表格为网页布局
第15课用表格为网页布局 绍兴市树人中学黄学锋1．设计思想 本节课的主题是对网页内容的排版。为了提高学生的建网兴趣，接受网页中表格的排版定位作用，设计了提供宠物——领养宠物——建立宠物园的教学过程，以“给宠物网上安家”、“不同的宠物需要不同大小的生活空间”等为引导，设计使用表格中不同大小的单元格来让宠物“和睦相处”。同时，请学生建立自已的开心宠物园，掌握网页的表格排版功能。 2．教材分析： 布局是网页制作的第一步，在本节教材中，先提出了规划布局，再进行表格定位，最后进行定位调整。这要求教学过程中需要对学生明确：对于网页中对象多而杂的情况，必需先规划、再定位，而用表格是一种很实用而有效的途径。 3．学性分析 在前几节课中，学生已学会了建立站点、新建主页、插入素材等操作。为了区别WORD和PPT等曾经排版方法，在学习网页排版时，创设一种情境能让学生对于多个网页对象能自然的用表格进行页面布局。通过这种教学方式，能让学生觉得网页表格排版理所当然，利用情境也大大提高了操作兴趣，在操作中掌握了技能。 4、教学目标 知识目标：用表格排版主页使其达到页面整洁有序； 技能目标：在网页中插入表格并更改表格的属性； 情感目标：用表格排版网页解决了网页版面杂乱的问题，提示同学们凡事要有计划，做事要遵守规则，促进其做事的信心。 5．重点难点 重点：插入表格和更改表格属性。 难点：让学生灵活掌握排列表格和设置表格属性的方法。 6．教学策略与手段 以网络流行的开心菜园、开心农场为引入，整堂课围绕建立自已的开心宠物园为主题对学生进行教学，最后通过若干学生作品展示来提高表格操作技巧。 7．环境与素材 1．教学环境：多媒体网络教室，配备投影仪;学生计算机中安装IE5.0以上版本及Frontpage2000以上中文版，要求能上因特网; 课本准备。 2．教学素材：为学生准备好一批宠物GIF图片。
制作网站——表格布局网页
制作网站——表格布局网页（第3-4课时） 教学目标： 1．知识与技能 （1）了解网页设计中表格的作用。 （2）掌握网页中表格的制作方法、表格属性的设置方法以及单元格的修饰与编辑方法，能 够在单元格中正确插入文字和图片。 （3）能够根据网页设计内容，正确布局表格的结构，掌握表格嵌套的设计方法。 2．过程与方法 （1）掌握软件学习中的对比学习法，培养学生迁移学习的能力。 （2）通过用表格结构设计网页，使学生进一步理解表格的作用、功能及网页设计方法的多 样性，培养学生的发散思维能力。 （3）通过自主探究，使学生掌握软件的使用规则，由摸索、探究性学习到形成性学习，培 养学生学会学习，驾御学习的能力。 3．情感态度与价值观 （1）通过对比学习使学生体验软件学习的一般方法及规律，提高学生自主学习信息技术的 能力。 （2）通过运用表格布局网页对象活动（各人根据网站主题，设计网页），进一步掌握各种 不同对象的属性设置方法和规律，体验创造的快乐。 （3）通过“动物——人类的朋友”表格页的设计与制作，再次激发学生关爱动物、保护动物的责任感，从而进一步树立共同改善人类生存环境的意识。 教学重点、难点： 1．教学重点： （1）了解表格在网页设计中的重要作用和功能。 （2）掌握插入、编辑表格的方法及表格的属性设置方法。 （3）掌握单元格的修饰与属性设置。 2．教学难点： 表格的嵌套设计在网页设计中的应用。 教学方法： 对比教学法、探究学习法、模仿学习法。 教学准备： 各自制作的站点文件夹，整理、归类相关素材并按要求摆放。 教学过程： 1．复习 以复习提问的方式来回顾站点的建立、网页的新建以及网页中文字、图像等对象的插入，学 生认真回顾，回答教师提问。为本节课教学做一定铺垫。 2．引入 （1）观看两个页面并进行比较：一个使用表格布局，但表格边框隐藏（看不出表格痕迹），其页面工整，文本、图片摆放对称，具有一定规律；另一个页面凌乱，图文混杂，摆放杂乱。你更喜欢怎样的页面布局？ 提出问题：有什么办法可以达到第一个页面的效果？ （2）观察第三个页面，内容与第一个页面相同，显现页面的表格边框。 学生讨论，交流，回顾Word中学习过的表格，明白表格在FrontPage中的作用。
利用表格布局网页教学反思
《网页中的表格》教学反思 表格的作用在网页制作中非常重要，网页的布局都由表格来控制，本节课通过任务驱动式教学，启发并引导学生完成任务。首先，给学生展示网络上的许多漂亮的网页，将网页布局的布局进行大概的分类，让学生体验表格在网页制作中的强大作用。由于学生在Word中已经学习过如何进行表格的操作，应此，将此部分的内容迁移到Frontpage还是比较简单的，所以本课主要以学生的自主探索为主，教师讲解为辅进行。 本节课使用任务驱动式教学法，通过启发的方式引导学生完成任务，首先，给学生展示如何用表格控制网页，通过与word类比的方法让学生认识表格的组成结构，接着，给学生展示一张利用表格控制后做出来的网页，明确目标，激发学生的学习兴趣。在学生学习的过程中给学生准备一个学程导航，让学生每次阅读任务的步骤，遇到操作中的难点，教师再进行示范。 在自主学习中，有效地培养了学生的动手能力，大部分的学生都能迅速地完成操作。但是学生在知识迁移的过程中还有一些小问题，因此，在今后的备课中还要加强每一个操作小任务的设计，对每一个操作的环节，应该准备操作的效果图，让学生能够快速直接地发现自己的问题，尽快去寻找解决问题的方法。 在本节教学过程中，要注意每一个小任务的提出，都要事先出示表格效果图，让学生面对眼前的实际问题，指导学生看书去寻求解决问题的方法，随后教师示范，学生看着大屏幕跟着一起解决问题，效果良好。另外，要求学生试制作“双休日活动安排表”这一残缺不全的表格时，教师一定要巡视每个学生，必要时结合本节课的知识要点进行个别辅导，让学得不扎实的学生也能尝受到成功的喜悦，以达到大面积提高教学质量的目的。
基于表格的页面布局教学设计
第3课开篇之作——基于表格的页面布局 教学设计 一、教学目标： 1.知识目标： （1）进一步熟悉Dreamweaver 8的工作界面。 （2）掌握利用“文件”面板打开网站的方法。 （3）学会根据网站素材的分类规划网站的文件夹。 （4）熟练地创建并保存网页。 （5）掌握设置网页标题的方法。 （6）能够根据网页内容使用表格恰当布局。 （7）学会设置网页背景色及表格背景图像。 （8）初步认识并尝试使用标签选择器选择对象。 （9）熟练地使用快捷键在浏览器中预览网页效果。 2.能力目标：让学生能动手完成一个简单的网页布局的设计。 3.情感目标： （1）培养学生严谨求实的工作态度以及感受美、评价美的艺术情操。 （2）培养学生在进行自主学习的过程中勇于克服困难，体验到成功后的快乐。 二、教学重点： 1.在“文件”面板中规划站点 2.设置网页标题 3.设置网页背景 4.使用表格对页面布局 三、教学难点： 根据网页内容使用表格恰当布局 四、教学策略的选择与设计 1、教学方法： （1）任务驱动—体验探究法 （2）分层教学法 （3）网络探究教学法 （4）激励教学法 2、学法指导：形象探究法、经验探究法、体验探究法、合作式学习法。 3、资源的设计与选择： 结合本节内容设计了一个《安全自护我能行》的网站首页、极域电子教室系统、Dreamweaver网页编辑软件、多媒体等。 五、课时：1课时 六、素材准备： 1、安全自护我能行——首页的效果图
2、首页背景图片：index.gif 3.练习题的图片：bg1.gif和bg2.gif 七、教学过程： 教学步骤教师活动学生活动教学形式（一）课堂引入 上节课我们做好了站点，当站点规划并创建完毕边授课边欣赏并对对学生机
第三章 使用表格规划网页布局
第三章使用表格规划网页布局 一、相关概念 1、表格功能：显示数据，定位网页元素（布局） 2、表格的组成： 表格由行和列组成，行和列的交叉形成的矩形形状称之为单元格。单元格中的内容和边框之间的距离叫边距cellpadding。单元格和单元格之间的距离叫间距cellspacing。表格的边线叫做边框border。tr：代表一行。td：代表一个单元格。 3、占位符： 当我们插入表格后，每个单元格的默认的高度是12像素的，但这些单元格中什么也没有，它是用什么撑起高度的？这都是“占位符”的功劳。因为一个单元格在没有设置高度值的时候，代表着此单元格的高度值为0，但如果这样就没法对单元格进行操作了，所以，Dreamweaver会在每个单元格中插入代码“ ”，用以撑起单元格的高度。 当我们在单元格插入内容，或是设定了单元格的高度数值，这个代码就会消失。如果想要设置低于12像素的单元格的高度时，也必须先将这个占位代码给删除掉才行。 二、插入表格 两种方法：①“插入”→“表格”命令 ②单击“插入”面板的“常用”类别中的“表格”按钮上，打开“表格”对话框。
1、宽度（百分比，像素）：相对显示，绝对显示 2、边距/填充：文本内容与边框之间距离 3、间距：单元格与单元格之间距离 4、标题：设置表格标题位置 【例4-1】：新建一个网页文档，在文档中插入表格（9行2列）并插入表格内容 【练习1】：制作下面表格 【练习2】：如何让文本与表格边框有一定空白区间，如下： 5、插入嵌套表格：嵌套表格就是在已经存在的表格中插入的表格。插入嵌套表格的方法与插入表格的方法相同。 【练习3】：利用表格制作下图样式： 说明：由于大表格控制的是网页整体的布局，为使之在不同分辨率的显示器下能保持统一的
网页设计与制作教案免费学技术改变生活
网页设计和发布流程 第一步是对站点进行规划 第二步是创建站点的基本结构 第三步即可开始具体的网页创作过程 最后一步是站点的发布 第一节站点的规划与创建 【教学目的与要求】 一、规划站点 二、创建一个站点 【教学方法与手段】 多媒体教学：借助多媒体手段，进行课堂理论教学； 启发式教学：教学活动关注的重点从结果转向过程。激发思维，师生互动，增强学生学习的主动性、积极性和创造性； 【教学重点与难点】： 基础知识：规划站点 重点知识：创建一个站点 2课时 【教学组织过程】2课时 1．上讲回顾 2．教授新知 【授课内容】 一、规划站点 Web站点是一组具有共享属性（如相关主题、类似的设计或共同目的等）的链接文档。 本地站点：是本地硬盘中存放远程网站所有文档的地方（文件夹）。 建立网站的通常做法是：在要地硬盘中建立一个文件夹用来存放网站的所有文件，往后就在该文件夹中创建和编辑文档。待网页设计和测试好之后，再把它们拷贝到网站上供浏览者浏览。 1、规划站点结构
注：规划站点的结构之前应先用笔绘出站点的结构图（如下图所示是一个典型的学校站点的结构图） 2、规划站点的浏览机制 一般可采用以下的方法： ●创建返回主页的链接 ●显示网站专题目录 ●显示当前位置 ●搜索和索引 ●反馈（将网页创作者或网站管理员公布在网页上，或创建一个E-MAIL超级链接，以使用户能快速地将信息反馈到网站中） 二、创建一个站点 步骤： 1、单击“文件”---“新建”---“站点”命令（或单击常用工具栏中“新建网页”按钮的下拉箭头，从打开的下拉菜单中选择“站点”命令） 2、选择一种站点模板或向导 3、单击“确定”按钮 三、站点的基本操作 1、打开站点：“文件”---“打开站点” 2、删除站点： 方法一：在Windows资源管理器中删除一个站点 方法二：在FrontPage中删除站点，在“文件夹”视图或“网页”视图的“文件夹列表”中，右击站点所对应的目录，在快捷菜单中单击“删除”命令 3、站点的设置 “工具”----“站点设置”，有“常规”、“参数”、“高级”、“语言”、“导航”、“数据库”六个选项卡 【课程小结】 【作业】 1．5 课后练习书本课后练习作业
用表格布局网页
第13课用表格布局网页 一、教学目标： 1．知识与技能 （1）了解网页设计中表格的作用。 （2）掌握网页中表格的制作方法、表格属性的设置方法以及单元格的修饰与编辑方法，能够在单元格中正确插入文字和图片。 （3）能够根据网页设计内容，正确布局表格的结构，掌握表格嵌套的设计方法。2．过程与方法 （1）掌握软件学习中的对比学习法，培养学生迁移学习的能力。 （2）通过用表格结构设计网页，使学生进一步理解表格的作用、功能及网页设计方法的多样性，培养学生的发散思维能力。 （3）通过自主探究，使学生掌握软件的使用规则，由摸索、探究性学习到形成性学习，培养学生学会学习，驾御学习的能力。 3．情感态度与价值观 （1）通过对比学习使学生体验软件学习的一般方法及规律，提高学生自主学习信息技术的能力。 （2）通过运用表格布局网页对象活动（各人根据网站主题，设计网页），进一步掌握各种不同对象的属性设置方法和规律，体验创造的快乐。 （3）通过“动物——人类的朋友”表格页的设计与制作，再次激发学生关爱动物、保护动物的责任感，从而进一步树立共同改善人类生存环境的意识。 二、教学重点、难点： 1．教学重点： （1）了解表格在网页设计中的重要作用和功能。 （2）掌握插入、编辑表格的方法及表格的属性设置方法。 （3）掌握单元格的修饰与属性设置。 2．教学难点： 表格属性和单元格属性设置 三、教学方法： 对比教学法、探究学习法、模仿学习法。 四、教学过程： 1．复习 以复习提问的方式来回顾站点的建立、网页的新建以及网页中文字、图像等对象的插入，学生认真回顾，回答教师提问。为本节课教学做一定铺垫。 2．引入 （1）观看两个页面并进行比较：一个使用表格布局，但表格边框隐藏（看不出表格痕迹），其页面工整，文本、图片摆放对称，具有一定规律；另一个页面凌乱，图文混杂，摆放杂乱。你更喜欢怎样的页面布局？ 提出问题：有什么办法可以达到第一个页面的效果？ （2）观察第三个页面，内容与第一个页面相同，显现页面的表格边框。
FrontPage2003轻松布局网页
FrontPage2003轻松布局网页 内容提要：很多朋友对FrontPage2003中增加的网页布局功能很感兴趣，现在我们一起来深入了解这一实用功能。用FrontPag 很多朋友对FrontPage2003中增加的网页布局功能很感兴趣，现在我们一起来深入了解这一实用功能。 用FrontPage2003的“布局表格和单元格”功能布局网页时，需要通过两部分来完成。 首先通过“布局表格”功能来为网页布局创建一个框架，然后通过“布局单元格”功能为该框架填充包含有网页内容（包括文本、图像、Web部件和其他元素）的区域，也就是单元格。 下面我们就以设置一个单位网站首页为例来了解一下用布局表格给网页布局的过程。 一、创建布局表格 1.创建布局表格 打开一个空白网页，并切换到“设计”视图下，单击“表格”菜单中的“布局表格和单元格”命令，随后在右侧弹出一个任务窗口（图1），在该任务窗口下面程序提供了多种表格布局模板，在此单击其中需要的模板即可将该模板添加到网页中。
2.绘制布局表格 如果你对模板中提供的布局表格不太满意，还可以用手工绘制的方法创建一个布局表格。创建时首先在“新建表格和单元格”项中单击“绘制布局表格”，随后将指针移到操作窗口最左端，然后拖动鼠标即可绘制表格。 3.设置表格属性 插入表格后，还需对表格属性进行设置。在“表格属性”项中设置该表格所需的属性。 提示：在设置表格时，如果要想覆盖网页的默认边距，并让布局表格跨到文档窗口的边缘，可以将表格中的各个边距的属性都设置为0。 在设计框架时经常需要调整某一行或列的属性，这时可以通过表格中列宽和行高的标签来完成。在操作窗口中单击布局表格需要调整的边框，每一侧都会出现显示列宽和行高的标
《网页中的表格》教学设计
《网页中的表格》教学设计 一、教学设计部分 本课的主要内容与地位 网页中，常用表格来对网页中其它元素定位，将复杂的元素有条理的分布到网页各个位置──网页布局。另外，当我们把表格的宽度定为固定像素值后，还能保证网页布局不会随浏览器窗口的大小变化而变化，当我们在网页中输入文字的时候，就可以让文字顶满格后自动换行，方便我们对文字的编辑。 由此可见，网页中只有利用表格进行布局，才能称得上真正意义上的网页设计。 本课与前后内容的关系 利用表格布局网页，将上一节设计的网站首页中的各种素材进行合理的分布，是对学生进行网页设计技能上的提升；利用表格布局网页也是整个网站设计中一个非常重要技术手段，应用非常广泛。 知识目标/技能目标 知识目标 理解表格在网页设计中的重要作用。 技能目标 ⑴掌握使用表格布局网页。 ⑵灵活掌握表格调整的方法。 过程与方法目标 能够合理利用表格对网页进行布局和规划。 情感态度与价值观目标 了解学校概貌，发现校园之美，理解规矩与方圆的关系，养成良好的生活和学习习惯。
本课的重难点 重点和难点：掌握利用表格对网页进行布局的方法 本课的课时分配建议 一课时 教法建议 由于关于表格的基本操作（插入表格、调整表格：调整行高或列宽、合并或拆分单元格、插入或删除行或列、平均分布行或列）在Word中已经有较详细的操作方法。在本课教学过程中，教师教学的重点应放在由学生探究以上基本操作的基础上的表格的使用──如何利用表格布局网页，让网页中的素材合理的在网页上分布。 另外，网页模板是提高建站效率的有效手段，教师要注意引导学生对网页模板的使用。 学法建议 注意观察和借鉴样板网站中表格的运用情况，刚开始使用表格设计网页时可将其边框粗细的值设为1，以观察调整表格的过程，从而掌握表格调整的技巧。 本课教学资源索引 1．第二课的半成品网页：Index．htm、Parents．htm 自评、互评、师评要注意的问题 学生制作的网页是否通过表格的布局达到美化、整齐和排列有序的目的。
用表格布局网页教学设计
用表格布局网页教学设计 教学目标 （一）知识与技能目标： 1、理解用表格布局主页的作用。 2、掌握在网页中插入表格进行排版。 3、学生设置表格的属性。 （二）过程与方法目标： 通过欣赏和借鉴别人布局的主页，取长补短，帮助学生进一步了解表格的作用、功能以及网页设计方法的多样性，培养学生的发散思维能力。（三）情感、态度与价值观目标: 用表格排版网页解决了网页版面杂乱的问题，培养学生在遇到困难时灵活运用各种方法解决，促进其建站信心。 五、重点与难点 教学重点：插入表格和更改表格属性。 教学难点：让学生灵活掌握排列表格和设置表格属性的方法。 六、教学策略与手段 游戏竞赛法，对比教学法，任务驱动法，讲解演示法，自主探究学习法，网站教学法，小组合作法。 七、课前准备 1、学生的准备 带课本进教室 2、老师的教学准备 （1）精心准备课堂，做好教学设计 （2）预先做好问题的设计及突发事件的应对 3、教学环境的设计与布置 多媒体网络教室，学生计算机中安装IE5.0以上版本及Frontpage2000以上中文版 4、教学用具的设计与布置 准备好一些具有代表性的版面设计优美合理的网站主页面作为参考八、教学过程 （一）、课堂导入 教师：第一次给大家上课，老师想了解一下情况，不知我们班是男生信息技术水平高还是女生信息技术水平高？ 学生：……… 教师：自己说了都不算，这节课我们就来较量一下。怎么样？先从第一个环节拼图游戏开始。
邀请两位同学（男生和女生）上来，分别选择其中一个，帮我把网页上图片的位置调整好。一位没调整好，另一位调整好了。 先采访一下失败的原因，你觉得问题出在哪里，是不是按照Word中的方法在操作，那你觉得在Word中图片、文字可以怎么样，而在FrontPage 中呢？ 采访另一个，发表一下你的成功感言，你觉得你为什么会成功，是网页中的什么帮了你的忙？网页里面有表格。也说是说在网页中要给图片定位，就必须要用到表格，表格在网页中起到了一个怎么样的作用——可以定位对象，即可以为网页布局，那怎样操作大家想不想学，今天这节课我们一起来学习第十五课《用表格为网页布局》。 板书：用表格为网页布局 （二）、页面布局 其实一般的网站都是用表格来布局的，我们先来欣赏几个网站。 1，2欣赏以后分别看编辑图，都是有表格，除了都有表格外，老师还发现了一个共同点，从整体看，得出这张主页都是怎么样的一个图形，半包围型，老师今天的这个教学网站也是包包围型。除了这个半包围型，你还看到过哪些。然后得出任务一，小组合作，让学生结合平时上网的经历，设计一张页面布局图，（分层教学）1、可以自行设计，2、也可以参考课本。 板书：1、页面布局 绝大部分同学已经设计好了。我看有几位同学做得很不错，然后展示，让学生具体说说他的设计。 （三）制作主页 （1）布局图设计好了，那么如何在网页中插入表格进行布局，我们以前在哪里学习过表格的插入——Word，当时是怎么操作的，想起来了吗？（表格——插入——表格） 看任务二。 任务二，①根据任务要求，探究着在FrontPage中插入一个6X3的表格。谁来试试，马上请一个学生来演示。演示好后，下面同学自己操作。板书：2、制作主页 （2）老师这里也有几个页面布局，这些都是网页上常用的布局图，其实这些都是从6X3的表格中，使用了对单元格的操作转变过来的，单元格怎么操作——合并单元格，选择一个，让学生讨论一下，叫一个学生演示。 如果我要在这里增加一格，怎么操作，去掉这格又怎么操作？具体操作一个。（三种操作都讲讲菜单、右键、手绘） ②把你自己刚才的创意布局用表格的形式呈现在网页上。 任务三：今天来了这么多老师，你能不能用刚才的布局图，做一张宣传
《用表格为网页布局》教学设计说课稿
《用表格为网页布局》教学设计《用表格为网页布局》是浙江教育出版社信息技术教材八年级上册第三单元第十五课的内容。本课是在学生学习建立网站站点后，开始尝试做第一张网页。通过本课的学习，是对表格知识的巩固和深入，更重要的是为后面的网页制作打下基础，所以本课是本单元的重点，起到承上启下的作用。前阶段学生已经学习了文本编辑、图片插入、网络基本知识、文件操作等内容，很多知识都可以迁移到本课来。八年级学生对电脑基本操作已经不再陌生，已经能够独立完成一定要求的学习任务，但是学生对于特定任务进行分析，整体规划能力相对还是比较欠缺的。本节课教学的作业设计中，我将注重培养学生这个方面的能力。根据课程标准和教材内容，我将本课的教学目标设计成三个方面： 知识与技能目标： 1、了解主页布局的常见布局图，并明确主页设计的基本要素； 2、理解用表格排版主页的作用； 3、掌握在网页中插入表格进行排版的技能； 4、学会设置表格属性，对表格进行编辑修改。 过程与方法目标： 通过欣赏、借鉴他人的主页布局，取长补短，为自己的主页布局做铺垫。 情感、态度与价值观目标： 1、通过作品欣赏，让学生意识到取长补短的可贵性，及在借鉴基础上的创新的重要性； 2、用表格排版网页解决网页版面杂乱问题，培养在遇到困难时灵活运用各种方法解决，强化建站信心。 为了实现这个教学目标，我将教学重点确定尾插入表格进行排版和更改表格属性。根据学生的思维障碍和学习情况的分析，我将难点定位于灵活掌握排列表格和设置表格属性。只有正确设置了表格的属性，才能美化和完善网页的布局。为了更好的突出教学重点，突破教学难点，圆满的完成教学任务，我在课前截取了典型的旅游网页图片素材并设置成框架形式让学生一目了然地看到表格所起的作用，并设置了几个学生需要突破的任务。 信息技术课是培养学生对信息技术的兴趣和意识，使学生养成良好的信息素养为宗旨，强调学生的自主学习和研究学习。上新课前，我要求学生两两合作，通过传统手工绘制草图的学习方式，设计你需要建立网页的框架布局，同时学会和与他人合作。为了让学生主动的参与学习，我在设计教学流程时，准备以学生“任务驱动”为主线，以教师为主导，以学生为主体，通过学生自主探究，合作交流完成教学任务。根据教学内容和学情的分析，本课我采用的教学方法有：讲解、练习、任务驱动、小组合作，学生可以通过小组合作、给定的任务等将本课学习用于实际操
浙教版初中信息技术 第十二课 用表格为网页布局 教学设计 (4)
第十二课用表格为网页布局教学设计 1教学目标 知识与技能: 1)了解表格在网页设计中的作用; 2)掌握网页中表格的制作方法、表格属性的设置方法以及单元格属性的设置方法,能够在单元格中正确插入文字。 3)能够根据网页设计内容,正确布局表格的结构,掌握表格嵌套的设计方法。 过程与方法： 通过对常见网页布局认识,了解网页板块分布结构,通过表格设计网页,掌握网页制作基本思路。 情感与价值观： 学生通过掌握利用表格设计网页思路,打破网页设计难度并激发网页创作的积极性。 2学情分析 学生通过上一节课准备的素材,如何组织用网页形式表现出来,这是学生期待的;另外sharepoint designer 2013软件与word界面相似,学生很容易迁移,技术入门会相对简单,主要是要有一个熟悉过程。学生通过网页制作设计思路形成,增强网页设计的积极性。 3重点难点 1)掌握插入、编辑表格的方法及表格属性设置; 2)掌握单元格拆分的方法及属性设置; 4教学过程 活动1【导入】课堂引入 我们上网主要是访问网络上网页资源,它包括丰富的资源,页面上有很多栏目板块。【展示幻灯片第1页】 提问1:哪个是网页标题栏、菜单栏、主题部分; 提问2:主题部分分开几个板块? 提问3:视觉中心在哪个位置? 活动2【活动】网页集中常见类型分析 分别请学生回答几种类型包括包围型、半包围型、主题突出型、导航型等四种; 活动3【讲授】小结网页布局特点 总结:网页布局要求简洁、有序、方便,注意浏览者视觉中心。
活动4【活动】复习新建站点 第1步:找到制作网页的软件SharePoint Designer;并新建站点。 任务1:新建站点; 活动5【活动】表格插入与内容填充 第2步: 插入表格 填充文字和图片到表格单元格中; 任务2:插入表格并填充各板块内容; 活动6【活动】解决学生存在问题 教师巡视学生操作情况并发现问题?请几位同学上来帮忙演示操作。 1)导航菜单用文字空格分隔开,而不是用单元格拆分; 2)单元格大小调整很难均匀; 学生上台演示操作解决学生存在困难。 【操作】选中第二行,在菜单栏中选择“表格”->“修改”->“拆分单元格”,设置列数为“5”问题2:单【操作】选择需要均匀分布的单元格,右击->”修改”->平均宽度。 活动7【活动】调整网页大小和表格大小 现在我们将做好的网页在浏览器里面查看一下效果; 提问:网页浏览有什么问题? 【教师演示】表格宽度修改操作。 缩小浏览宽度后请学生观察? 教师演示网页大小修改操作步骤 任务4:修改表格大小为960像素宽度;网页大小修改为960像素 活动8【活动】作业上交 要求上交站点文件夹
html表格布局实例
[html]表格布局之实例版 | [<<][>>] 前面我们讲了html表格的基础知识，今天我们通过一个实例让大家更清晰的了解下表格的用途。 例如：我们做一个简单的网站布局，代码如下：
| 网站名称 | ||
| 网站标题 | 搜索框 | |
| 左边 | 中间 | 右边 |
| 网站底部信息 | ||
这是一张整体的表格，第一行和第四行分别跨度了三列，这里用 colspan="3"来限制，而第二行的“搜索框”占用了两列的位置，用colspan="2"控制；align="center"是对表格内文字的对齐限制，center表示中间，right 表示靠右，left靠左。 表格的基础设置，可以参考： [html]利用表格规划网站布局 [html]如何制作多行多列的表格 [html]设定表格的尺寸和边框 如果你现在可以根据自己的想法制作出一个表格了，那么你就是向自己制作模板迈近了一步。^o^ 表格布局现在仍然很多人在用，方便实在。 网页设计现有两种布局方法，一种即是表格布局，另一种是现在W3C极力推荐的CSS布局。不过，就目前来说，由于xhtml并未完全占据主流，表格布局依然是大多数网页设计师的首选。 你所描述的问题属于表格的对齐问题，解决方式有以下几种： 如果两个表格的宽度不一致，那么选择默认的对齐方式，也即左对齐，在html 中的标签和属性是：
利用表格进行网页页面的布局教学设计
利用表格进行网页页面的布局教学设计《利用表格进行网页页面的布局》教学设计 上海市蒙山中学夏勤 在教学过程中发现:学生在网页制作时，往往只重视网页内素材的添加，而忽略了素材间的整体布局效果，致使制作出的网页布局不合理美观，页面上的素材布局杂乱无章。为了解决这个问题，我设计了“如何利用表格进行网页页面的布局”这节课的内容。 本节课的教学对象是预备年级的学生，对于预备年级的学生来说，仅仅简单的讲解表格的使用，不利于学生对“利用表格布局网页页面”这一知识点的理解和实际信息技术应用能力的提高，因此，我在设计这节课的教法时，主要采用项目活动教学模式，整个项目活动通过比较、提问、引导、合作、展示、交流、评价等教学方法得以开展，激发了学生利用表格布局网页页面的积极性，培养和提高了学生辨别表格布局网页页面的能力、分析和解决如何利用表格布局网页页面的能力、审美能力、语言组织和表达能力、归纳能力、自主学习能力。 1( 先回顾网站制作的步骤，并展示两张素材相同而布局不同的网页，让学生进行比较、 分析、归纳出两张素材相同而整体页面效果不同的原因是其中一张网页是利用表格布 局了页面，从而引出本节课的课题——利用表格布局网页页面。 2( 师生继续分析页面效果好的那张网页，其布局页面的表格结构有几行几列，引出问 题:如何对表格进行处理而使页面布局更合理,即表格的编辑操作。 3( 教师以页面较杂乱的那张网页为例，进行插入表格、合并、拆分单元格等示范操作。
4( 学生以小组为单位根据实际情况，进行“利用表格布局网页页面”的实践操作练习。 教师针对不同水平的学生进行分层教学:对特殊学生，允许他们完成一张网页的表格 布局。教师给予较多的个别辅导机会。对天才学生，要求完成网站内多张网页的表格 布局。 5( 要求各小组将已经利用表格布局好的网页进行交流展示，各小组评价。以网页上各类 素材间整体布局的合理性、谐调性和美观程度为评价标准。达到加深学生对利用表格 布局网页的理解及提高解决实际问题的能力，同时激发学生的积极性，并从中获取成 功的体验。 6( 课堂小结则分成教师强调实践操作注意点和学生总结“利用表格布局网页”的重要性 两部分组成。 7( 为了巩固新知识及更好的布局网页页面，要求学生课后以小组为单位进行分工操作， 预先在草稿纸上设计好各自所负责网页页面的表格结构，以便上机操作时更快捷的完 成页面布局。
《应用表格布局网页结构》教案
《应用表格布局网页结构》教案 一、教学目标 1、知识与技能： （1）了解表格网页的作用； （2）掌握网页中表格的制作方法，表格属性的属性设置方法； （3）能根据网页设计内容，正确布局表格的结构； （4）尝试根据内容需要设计表格布局网页页面。 2、过程与方法： （1）利用对比，加深学生对表格布局网页的认识； （2）通过用表格结构设计网页，使学生进一步理解表格的作用、功能及网页设计方法；（3）通过自主探究，使学生掌握软件的使用规则，培养学生自主学习的能力。 3、情感态度与价值观： （1）通过实践创作的过程，形成主动学习和利用信息技术、参与信息作品创作的态度；（2）培养学生注重吸取成功的经验，提高本身的信息素养。 二、教学重点 1、表格的制作及设置方法； 2、根据实际情况设计并应用表格布局网页。 三、教学难点 1、应用表格布局网页页面的意识； 2、合理制作表格，实现页面布局。 四、教学方法 教师讲解、演示、与学生任务驱动、合作学习相结合。 五、教学过程 教学过程 教师活动 学生活动 课前准备 将“学习素材”文件夹发送到学生机桌面； 打开并预习本课内容。 一、对比，引入新课 1、明确表格在网页制作时的作用：页面规划 （1）展示两个页面（1.htm和2.htm）并进行比较： 提问：①这2个网页，你喜欢哪个？为什么？
②网页中的文字、图像对象如何插入？ ③在Frontpage中打开2张网页，观察有什么不一样。 总结：这些线就是表格线，在做网页时，可以利用表格布局网页结构。 （2）引出本课内容：探索用表格来布局网页的页面。 （3）明确本课的任务：使用表格制作网页。 学生小组交流、讨论，对比加深印象，感受表格布局网页的作用 发现表格可以布局页面 明确本课内容 二、小组合作，体会用表格布局网页 2、模仿用表格布局网页页面结构 （1）引导学生回忆Word中学过的表格内容，提示学生表格操作跟Word中具有很大的相通之处； 提问：还记得哪些表格的编辑方法？ （2）展示效果页，引导学生分析页面的结构，探索需要制作表格的结构； （3）讲解演示表格的制作及调整； （4）布置学生完成任务一：“心憩空间”网页 （5）展示成功学生的作品，引出表格属性的设置； 如：行列的插入、删除、单元格的合并、拆分、调整大小等。 根据网页内容来规划所需表格结构，了解网页中表格制作及设置的方法。 学生小组合作，完成网页“chushi.htm” 三、小组合作，尝试用表格布局网页 3、小组交流并独立制作表格布局网页 （1）刚才我们一起体会用表格布局网页的网面结构：先分析确定所需表格的结构，然后根据实际制作设置表格布局网页页面结构。接下来我们就来尝试用表格布局我们的网页了；引入用表格布局“多彩的生物”网页； （2）引导学生分析确定网页的表格结构； （3）布置学生完成任务二：制作“多彩的生物”网页；可以根据自己的设计对网页进行适当的调整； 掌握根据网页确定所需表格的结构 能根据网页规划表格 小组合作讨论，根据学案提供的参考表格确定“多彩的生物”网页的表格结构，再独立完成图片、文字的插入。 四、作品展示交流与课堂总结
使用表格布局网页
巧用表格来布局 【学科领域】本教案所适用的学科为八年级信息技术学科。 【内容概述】在用FrontPage制作网页的过程中，良好的版面设计是使网页美观的要素之一。在本课的学习中，学生通过比较，了解使用表格可以合理布局网页空间，起到美化网页的作用。 【学习目标】 1．知识与技能：熟悉表格在网页编辑中的作用；掌握用菜单命令和工具按钮插入表格的方法；学会用菜单命令、快捷菜单命令、鼠标操作等不同的方法对表格进行编辑。 2．过程与方法：通过知识迁移，培养学生利用已学过的知识进行自主学习的能力；利用表格使网页布局合理、美观，从而让学生对网页制作更有兴趣。 3．情感态度价值观：培养学生独立思考、自主学习、合作讨论的能力，通过自己探究问题，进一步树立学生学习信息技术的自信，提高学生学习网页制作的兴趣。 【课时安排】：1课时。 【教学重难点】： 1、重点：表格在FrontPage中的作用；表格的插入与编辑；“表格”的菜单命令。 2、难点：表格属性、单元格属性。 【教学过程】： 一、教学表格的插入
1．直觉判断 （1）观看两个页面进行比较：一个是用表格存放文本、图片，表格边框隐藏，页面美观；一个是上节课制作的页面，有图有文但没有表格的页面。 提出问题，学生讨论，有什么办法可以达到第一个页面的效果？（2）观察第三个页面（用表格存放文本、图片，但表格边框未隐藏的网页），告诉学生其实有一种方法很简单，而且利用的是在学习Word时用过的一种工具，这就是表格，但是在FrontPage中表格的作用比Word中作用更大了。 2．任务驱动、知识迁移、观察总结 布置任务1：回忆过去学Word时是如何插入一个3行2列的表格的，尝试一下在FrontPage中是不是可以用同样的方式插入这样的表格。并仿照刚才观看的第三个页面将“我的第一个网页”进行修改。遇到问题可查阅书上“插入表格”的步骤。 小组讨论总结FrontPage中的表格比Word中有了什么更大的作用。 二、教学表格的编辑 1．推测、实践、证实（培养自主学习的方法） 提出问题：在Word和FrontPage中插入表格的方法是一样的，但是编辑表格是不是也一样呢？
《网页中的表格》教案设计
《网页中的表格》教案设计 一、教学设计部分 教学内容分析 R本课的主要内容与地位 网页中，常用表格来对网页中其它元素定位，将复杂的元素有条理的分布到网页各个位置──网页布局。另外，当我们把表格的宽度定为固定像素值后，还能保证网页布局不会随浏览器窗口的大小变化而变化，当我们在网页中输入文字的时候，就可以让文字顶满格后自动换行，方便我们对文字的编辑。 由此可见，网页中只有利用表格进行布局，才能称得上真正意义上的网页设计。 R本课与前后内容的关系 利用表格布局网页，将上一节设计的网站首页中的各种素材进行合理的分布，是对学生进行网页设计技能上的提升；利用表格布局网页也是整个网站设计中一个非常重要技术手段，应用非常广泛。教学目标分析 R知识目标/技能目标 ·知识目标 理解表格在网页设计中的重要作用。 ·技能目标
⑴掌握使用表格布局网页。 ⑵灵活掌握表格调整的方法。 R过程与方法目标 能够合理利用表格对网页进行布局和规划。 R情感态度与价值观目标 了解学校概貌，发现校园之美，理解规矩与方圆的关系，养成良好的生活和学习习惯。 R本课的重难点 重点和难点：掌握利用表格对网页进行布局的方法 R本课的课时分配建议 一课时教学策略设计建议 R教法建议 由于关于表格的基本操作在ord中已经有较详细的操作方法。在本课教学过程中，教师教学的重点应放在由学生探究以上基本操作的基础上的表格的使用──如何利用表格布局网页，让网页中的素材合理的在网页上分布。 另外，网页模板是提高建站效率的有效手段，教师要注意引导学生对网页模板的使用。 R学法建议 注意观察和借鉴样板网站中表格的运用情况，刚开始使用表格设计网页时可将其边框粗细的值设为1，以观察调整表格的过程，从而掌握表格调整的技巧。教学资源与环境建