6_网站创建与网页制作汇总.doc

课题序号6教学班级1016教学课时4教学形式新授课 题 名 称任务五 布局技术之一—表格使用教具PPT课件 学案 教学目的 1. 熟练运用表格掌握页面布局技术。 2.能够通过表格的定位使页面的布局更加合理、美观。 教学重点1.熟练掌握表格的添加与编辑。 2.掌握表格中操作行和列的方法。 3.掌握单元格的拆分与合并方法。 4.掌握在表格中输入文字、图像并定位的方法。 5.掌握嵌套表格的用法。 6.掌握布局表格、单元格的绘制与属性设置方法。教学难点1.掌握表格中操作行和列的方法。 2.掌握单元格的拆分与合并方法。 3.掌握在表格中输入文字、图像并定位的方法。 4.掌握嵌套表格的用法。 5.掌握布局表格、单元格的绘制与属性设置方法。更新补充课前准备 教案、学案、课件 课外作业 使用表格搭建页面 （p62图3-1） 板 书 设 计任务五 表格布局网页 1.表格的添加与编辑 2．掌握表格中操作行和列的方法。 3.单元格的拆分与合并方法 4.表格中输入文字、图像并定位的方法 5. 嵌套表格的用法。 6.布局表格、单元格的绘制与属性设置方法教 学 感 想  课堂教学安排 教学环节主 要 教 学 内 容教学手段与方式复习导入 新授  = 1 \* ROMAN I、复习导入 展示上节课学生的作业，复习知识点  = 2 \* ROMAN II、新授 出示任务 3.1.1使用表格搭建网页 预览效果 图3-1 问题探究----认识表格 表格的组成 表格由边框、行、列、单元格组成。整张表格的边缘称为边框，水平方向的一组单元格称为行，垂直方向的一组单元格称为列，行列交叉部分就称为单元格，单元格中的内容和边框之间的距离称为边距，单元格和单元格之间的距离称为间距。如图3-1所示。行列单元格边框间距边距。 2.插入表格 选择“插入记录/表格”命令，或在“插入”栏的“常用”类别 中单击“表格”按钮，弹出如图3-2所示的“表格”对话框。 3设置表格及单元格属性 （1）表格属性 提问：填充、间距、边框分别指什么？ 背景贪色、边框颜色、背景图像设置方法 （2）单元格属性 提问：拆分单元格、合并单元格方法 单元格背景图片、背景颜色的设置 （3）设置行、列属性 4.编辑调整表格 添加行和列 删除行和列 合并/拆分单元格 5. 嵌套表格 在现有的单元格或表格内插入一个表格，插入表格的大小受所在单元格大小的限制。网页的排版有时会很复杂，通过一个表格控制页面的总体布局，如果一些内部元素也通过总表来实现排版细节的话，很容易引起行高或列宽的冲突；浏览器在解析网页时，下载完整个表格的结构后才显示表格，通常浏览者需等待很长才能看到网页内容。 嵌套表格的使用使页面布局更加灵活，外部父表格控制页面的整体布局，嵌套表格负责各子栏目的排版，互不干扰。 注意：表格可以无限制的多层嵌套，但嵌套层数越多浏览器解析的速度就越慢，访问者等待时间就越久，通常情况下，表格嵌套深度不超过三层。 知识拓展----布局模式和扩展表格模式 1.布局模式-绘制布局表格 在“布局”模式下，可以在页面上绘制布局表格和单元格，包括嵌套在其他表格中的表格。绘制表格和绘制单元格变成了各自独立的操作。如果绘制的布局单元格不在布局表格中，Dreamweaver CS自动创建一个布局表格作为该单元格的容器，布局单元格不能存放在布局表格之外，靠齐网格有助于对齐单元格。 注意：表格不能互相重叠，但可以嵌套。 2.布局模式-为布局单元格添加内容 布局表格创建后，表格以灰色填充，表示该区域不能插入内容，因此必须在表格中创建布局单元格后，才能在布局单元中插入文本、图像或媒体等内容。当添加宽度或高度大于布局单元格的内容时，该单元格将自动扩展，这可能会改变周围单元格的大小。该列的列宽变为显示代码中出现的宽度，后面的括号中是该列的可视宽度（屏幕上显示的宽度）。 3.扩展表格模式 嵌套表格过多时，为了方便观察和布局，使用扩展表格模式使表格的编辑更容易。执行“查看/表格模式/扩展表格模式”命令（快捷键F6），或单击“插入”面板“布局”选项卡下的按钮，此时便可以清楚地看出表格的嵌套关系，在“文档”窗口的顶部会出现标有“扩展表格模式”状态条 。 Ⅲ、课堂总结 利用表格搭建网页时，应先规划好页面中个元素的具体位置???通过表格将这些区域划分出来，在单元格中插入元素后，在仔细调整各单元格的大小、位置，使页面各个元素的所在位置与实际需要相符。掌握插入表格和绘制表格两种方法布局网页。 Ⅳ、课后作业 完成任务3.1.1用两种方法：插入表格的方式