第三单元任务一.docVIP

第三单元 制作“作品展示”网页 任务一 创建表格 一、提出任务 1．任务目标表格在中的作用 ⑶ 掌握创建表格的基本方法 ⑵?鼓励学生根据任务需求进行科学合理的设计，提高学生分析问题与解决问题能力。 三、教学分析与准备 1. 教学重点 ⑴ 理解表格在中的作用表格的基本方法教学难点 ⑵ 创建嵌套表格。 3. 教学方法 任务驱动学习、协作学习、探究拓展学习与举一反三相结合。 4. 课时安排 4课时 5. 教学环境 集中学生注意力，准备上课。 通过提问考察学生对插入图像基础知识的了解。 如何在网页上插入一张图片，并调整图片的大小、位置？ 学生分组讨论如何在网页上制作一个班级通讯录，每行内容有“姓名、照片、地址、联系电话”。 通过上面讨论，引导学生认识利用表格制作通讯录是方便快捷的方式，再引导学生联想生活中用到的表格，进而了解表格在网页制作中的广泛应用。 在Dreamweaver 8中，表格是用于在页面上显示表格式数据及对文本和图像等元素进行布局的强用力的工具。本任务将学习在网页制作中如何灵活运用表格。 提出任务：利用表格规划、布局作品展示网页。 依据设计图样，可以使用四个表格把页面划分为四个区域，四个表格分别命名为“table1”、“table2”、“table3”和“table4”。依据不同的设计内容，这四个表格还需要进行相应的编辑与嵌套。 1．分析网页布局 ⑴ 见课本图3-2，教师带领学生进行页面表格分析。 引导学生了解：“table1”是一个2行1列的表格。第一行用于放置网站标题及图像，第二行嵌套一个1行5列的表格“table1-1”，用于放置五个导航按钮。 “table2”是一个1行4列的表格。左右单元格为空白区域，中间两个单元格分别用于放置“作品展示”和“友情链接”两张图像。 “table3”是一个1行3列的表格。左右单元格为空白区域，中间单元格用于放置作品分类标题和图像。在中间单元格嵌套一个6行1列的表格“table3-1”。“table3-1”表格的每一行再嵌套一个表格，其中第一、三、五行分别嵌套一个1行2列的表格，用于放置图标及作品题目；第二、四、六行分别嵌套一个1行5列的表格，放置三幅作品及左右两个空白区域。 “table4”是一个3行1列的表格，第一行是空白区域，第二行通过设置行属性显示为一条细线，第三行放置版权信息。 重点理解如下内容： ａ．课本图3-1页面布局由4个大表格组成，分别分析每个表格的作用。 b．什么是嵌套表格（插入嵌套表格是指在表格的单元格中插入新的表格。）和嵌套表格的作用。 ⑵ 教师举一些网页布局的实际例子让学生进行协同分析。总结：通过以上几个实际网站页面的例子，介绍表格布局知识，即许多网页分为上、中、下三个部分上面部分放置网页的标题中间部分网页的内容,下部分制作者的信息。浏览器在解析网页时，将整个网页的结构下载完后才显示，如果不使用嵌套表格非常复杂，浏览者要等待很长时间才能看到网页内容。表格时，应该：整个不要在一个表格里，多个表格。表格的嵌套层次尽量要少。单一表格的结构尽量整齐。 2．创建目录结构 在Dreamweaver 8中打开“幽幽我心的个人网站”，依据第一单元建立的网站目录结构，在本栏目“works”文件夹中新建文件“works.html”，然后把光盘中本单元素材中的“wkimages”、“flash”、“links”文件夹复制到本栏目“works”文件夹中。本栏目目录结构如课本表3-1所示。 3．创建表格的知识 ⑴ 练习插入一个表格：学会使用菜单、“插入”栏、快捷键创建表格。 ⑵ 回答表格对话框中如下选项的作用： “页眉”选项组、“标题”、“对齐标题”、“摘要”。 ⑶ 要求学生回答下列问题： a．大多数浏览器默认显示单元格边距、间距是多少？若要确保浏览器显示的表格没有边距和间距，必须把单元格边距和单元格间距设置为多少？ b．如果没有明确指定边框的值，则浏览器显示表格800*600分辨率下，把表格宽度最大设置为778像素，在1024*768分辨率下最大设置为1002像素。） e．如何给当前表格命名？如何删除当前选中的表格？ f．嵌套表格的宽度受所在单元格宽度的限制吗？ 4．自己动手 根据所学知识，创建课本图3-1页面所需表格结构。 通过完成本任务学习了： ⑴ 创建表格 ⑵ 表格布局页面 ⑶ 表格在页面中的作用： 让学生讨论表格在网页制作中的作用：网页中既有明显的表格，也有隐含的表格；表格在网页中有两种作用：布局与真正的表格。 创建网页“practice3-1.html”，在网页中插入一个6行5列的表格，宽500像素，边框粗细与单元格间距均为5像素，页眉选择“顶部”，标题为“产品信息”，保存并预览网页。 回想插入表格的几种方法，考虑页眉、标题等选项出现在哪个对话框的选项卡中，并考虑如何