下载文档原格式
小学五年级信息技术导学案课题：用表格布局网页设计：赵治 学生姓名：一、探究任务（一）：修改表格属性1、打开“桌面——银杏之乡-呼家庄”文件夹中的名为“yinxing.html ”的文件。
2、首先用鼠标左键单击图片一下，执行“修改”——“表格”——“选择表格”命令，在下面“属性”工具栏中操作：将表格属性 宽 改为480，表格属性 对齐 为“居中对齐”3、找到表格属性面板中“对齐”列表框，选择“居中对齐”。
4、选中第三行单元格，在单元格“属性”中将文字“中文学名：银杏” “居中对齐”（如图）5、文件——保存6、文件——在浏览器中预览效果——IE8二、探究任务（二）：利用表格布局网页（1）网页表格中插入图片与文字1、打开dreamweaver8程序，新建网页，标题为“银杏果实”，保存为“yinxingguoshi.html ”2、插入一个3行1列、宽度为600像素的表格。
—— 在下方“属性”工具栏 —— 对齐 方式为“居中对齐”3、选中第一行单元格，将光标“居中对齐”，从“银杏的果实”文件夹中选取“银杏果5”图片，插入到单元格中。
4、选中第三行单元格，将光标“居中对齐”，并输入“第二实验小学 五年级 班，姓名 ”（2）网页表格中插入表格1、将光标移动到第二行单元格中，在这个单元格 插入一个3行3列，宽度为600像素的表格。
2、用鼠标选中新插入的表格中第一行的三个单元格，并用“修改”—“表格”——“合并单元格”命令，合并成一个单元格。
重复上述操作，将第三行的三个单元格合并（3）单元格中背景颜色的选取1、选中新插入的表格中第一行单元格，并将光标“居中对齐”，在这个单元格中插入“银杏果7”图片，设置单元格颜色：首先将鼠标在本单元格中左击一下，点击“背景颜色”用吸管吸取图片“银杏果7”中的 果实 颜色作为背景颜色。
2、选中新插入的表格中第三行单元格，并将光标“居中对齐”，在这个单元格中插入“银杏果3”图片，设置单元格颜色：首先将鼠标在本单元格中左击一下，用吸管吸取图片“银杏果3”中的 果实 颜色作为背景颜色。
表格布局网页课程设计一、课程目标知识目标：1. 让学生掌握网页设计中的表格布局基础知识，理解表格布局的原理和用途；2. 学会运用HTML标签创建表格，设置表格的行、列和单元格属性；3. 掌握CSS样式表中与表格布局相关的属性，如边框、间距、填充等。
技能目标：1. 培养学生运用表格布局设计网页的能力，能独立完成简单的网页布局；2. 提高学生在网页设计中的问题解决能力，能够调整表格布局以适应不同设备和屏幕尺寸；3. 培养学生团队协作和沟通能力，能在小组合作中共同完成网页设计任务。
情感态度价值观目标：1. 培养学生对网页设计的兴趣和热情，激发学生的创造力和创新精神；2. 培养学生关注用户体验，注重网页布局的美观性和易用性；3. 增强学生的信息素养，使学生认识到网络技术在信息传播中的重要作用。
课程性质：本课程为信息技术课程，以实践操作为主，结合理论知识，培养学生的实际操作能力和创新思维。
学生特点：学生处于初中阶段，对新鲜事物充满好奇，具备一定的计算机操作基础，喜欢动手实践。
教学要求：教师应注重理论与实践相结合，以学生为主体，引导学生主动探究，培养其独立思考和解决问题的能力。
同时，关注学生个体差异，因材施教，确保每个学生都能在课程中取得进步。
通过课程学习，使学生能够达到上述具体的学习成果，为后续的网页设计学习打下坚实基础。
二、教学内容1. 理解表格布局的概念与作用- 表格布局的定义与分类- 表格布局在网页设计中的应用场景2. HTML表格标签的使用- <table>、<tr>、<td>、<th>等基本标签的用法- 表格行、列、单元格的属性设置3. CSS样式表中与表格布局相关的属性- 边框样式：border、border-collapse、border-spacing等- 单元格样式：padding、margin、text-align、vertical-align等- 表格背景与颜色：background-color、background-image等4. 表格布局实例分析与操作- 分析经典表格布局案例，了解其设计思路和实现方法- 学生实践操作，完成一个简单的表格布局网页5. 响应式表格布局- 介绍响应式网页设计的基本概念- 学习使用CSS媒体查询调整表格布局以适应不同屏幕尺寸6. 表格布局在实际项目中的应用- 分析实际项目需求，确定表格布局设计方案- 学生团队合作，完成一个具有实际意义的网页设计项目教学内容安排与进度：第1课时：理解表格布局的概念与作用，学习HTML表格标签的使用第2课时：CSS样式表中与表格布局相关的属性，分析表格布局实例第3课时：实践操作，完成一个简单的表格布局网页第4课时：学习响应式表格布局，调整表格布局以适应不同屏幕尺寸第5课时：团队合作，完成实际项目中的表格布局设计教学内容与教材关联性：本教学内容与教材中关于网页设计、HTML和CSS的知识点紧密相关，涵盖了表格布局的基本概念、用法和实际应用，确保了教学内容的科学性和系统性。
第三章使用表格规划网页布局一、相关概念1、表格功能：显示数据，定位网页元素（布局）2、表格的组成：表格由行和列组成，行和列的交叉形成的矩形形状称之为单元格。
单元格中的内容和边框之间的距离叫边距cellpadding。
单元格和单元格之间的距离叫间距cellspacing。
表格的边线叫做边框border。
tr：代表一行。
td：代表一个单元格。
3、占位符：当我们插入表格后，每个单元格的默认的高度是12像素的，但这些单元格中什么也没有，它是用什么撑起高度的？这都是“占位符”的功劳。
因为一个单元格在没有设置高度值的时候，代表着此单元格的高度值为0，但如果这样就没法对单元格进行操作了，所以，Dreamweaver会在每个单元格中插入代码“ ”，用以撑起单元格的高度。
当我们在单元格插入内容，或是设定了单元格的高度数值，这个代码就会消失。
如果想要设置低于12像素的单元格的高度时，也必须先将这个占位代码给删除掉才行。
二、插入表格两种方法：①“插入”→“表格”命令②单击“插入”面板的“常用”类别中的“表格”按钮上，打开“表格”对话框。
1、宽度（百分比，像素）：相对显示，绝对显示2、边距/填充：文本内容与边框之间距离3、间距：单元格与单元格之间距离4、标题：设置表格标题位置【例4-1】：新建一个网页文档，在文档中插入表格（9行2列）并插入表格内容【练习1】：制作下面表格【练习2】：如何让文本与表格边框有一定空白区间，如下：5、插入嵌套表格：嵌套表格就是在已经存在的表格中插入的表格。
插入嵌套表格的方法与插入表格的方法相同。
【练习3】：利用表格制作下图样式：说明：由于大表格控制的是网页整体的布局，为使之在不同分辨率的显示器下能保持统一的外观，大表格的宽度一般使用像素值，而为了使嵌套表格的宽高不和总表格发生冲突，嵌套表格一般使用百分比来设置宽和高。
【思考】：利用嵌套表格留空白操作方法：插入一个1行1列的表格，再在此表格中插入一表格，此时新插入的表格设置时宽度要小一些，另外最好不要设置边框。
利用表格布局网页教案教案标题：利用表格布局网页教案教学目标：1. 了解表格布局的基本概念和原理。
2. 掌握使用HTML和CSS创建基本的表格布局。
3. 能够灵活运用表格布局设计网页。
教学准备：1. 计算机和互联网连接。
2. HTML和CSS编辑器软件。
3. 示例网页代码和相关图片素材。
4. 课堂展示设备。
教学过程：Step 1: 引入表格布局概念（5分钟）介绍表格布局的基本概念和原理，解释为什么表格布局在网页设计中非常有用。
Step 2: HTML表格结构（10分钟）解释HTML表格的基本结构，包括表格、行和单元格的标签及其属性。
演示如何创建一个简单的表格。
Step 3: CSS样式设置（15分钟）说明如何使用CSS样式设置表格的外观，包括表格边框、背景颜色、字体样式等。
演示如何应用样式到表格中。
Step 4: 表格布局设计（20分钟）展示一些常见的表格布局设计示例，如网站导航菜单、产品特性比较、课程时间表等。
解释如何将内容合理地安排在表格中。
Step 5: 实践操作（30分钟）让学生动手实践，在编辑器中创建自己的网页，并使用表格布局设计页面结构。
提供示例代码和图片素材供学生参考。
Step 6: 学生展示和讨论（15分钟）让学生展示他们设计的网页，并就设计选择、布局优化等方面进行讨论和反馈。
Step 7: 总结和拓展（5分钟）总结表格布局的优点和应用场景，并鼓励学生进一步探索其他网页布局方式。
教学评估：1. 学生在实践操作中的表现和成果。
2. 学生对表格布局的理解和应用能力。
3. 学生在展示和讨论环节的参与和表达能力。
教学延伸：1. 鼓励学生进一步研究和尝试其他网页布局方式，如Flexbox和Grid布局。
2. 引导学生学习响应式设计，掌握如何使用媒体查询和表格布局来适应不同屏幕尺寸。
教学反思：根据学生的实际情况和学习进度，灵活调整教学过程中的时间分配和内容讲解，确保学生能够理解和掌握表格布局的基本原理和应用技巧。
小学五年级信息技术教学设计课题：《用表格布局网页》执教：高密市井沟镇呼家庄小学赵治一、教材分析：本节选自青岛版信息技术教材中的《用表格布局网页》一课，主要内容是学习在表格中插入图片、调整图片以及表格中插入表格方法（也叫表格的嵌套），本课是在学生掌握了表格制作的基础上进行的，通过本节课的学习为美化网页迈出了重要的一步，能够培养学生学习的浓厚兴趣。
二、学情分析：本课的讲授对象是小学五年级学生，通过前二个课时的学习，学生对网页已有了基本的了解，学生能够熟练的启动、退出网页、制作表格并插入新图片，能够利用菜单进行一些基本操作，也为本节课的学习打下了基础，所以，引导学生探究完成学习目标对学生来说并不困难。
三、教学目标：1、知识与技能：掌握在表格中插入图片的方法和表格中插入表格的方法与技巧，设置单元格背景颜色。
2、过程与方法：通过小组合作形式，运用任务驱动方式，培养学生的协作探究能力。
3、情感、态度和价值观目标：通过小组合作培养学生的合作意识和探究能力；通过作品的美化布局与评价，培养学生的审美意识。
通过介绍银杏美景，培养学生热爱大自然的情怀。
四、教学策略：为鼓励学生大胆动手操作，利用探究任务的形式完成一个个操作，让学生根据已有知识和教师的指导、同伴的帮助，通过导学案的引领，自主探究完成操作；通过展示和评价学生的作品，提高学生的审美意识，体会成功的喜悦。
五、教学重点与难点：1、重点：在表格中插入图片及表格中插入表格的方法。
2、难点：表格的嵌套在网页设计中的应用。
六、教学过程：七、教学后记：本节课利用网络环境下的多媒体教学系统呈现教学内容和控制教学。
教学过程中，通过小组合作完成探究任务的形式，运用探究学习、合作学习、任务驱动等教学方式完成一个个教学任务。
整个过程引导学生大胆质疑、大胆尝试不同的操作方法，注重学生动手能力与合作探究能力的培养。
利用小组合作，让学生教学生，协作互助，教师始终保持一个指导者、组织者的角色，体现师生关系的和谐。
