第四讲 课 题：在 Dreamweaver8 中使用表格布置页面 目的及要求：使用表格布置页面 教学重点：重点掌握设置表格属性的方法 教学难点：嵌套单元格设置布局表格的形式对网页进 行布局 教学课时： 2 课时 教学方法：提问与比较教学方式，激发学生兴趣； 教学内容与步骤：

Presentation on theme: "第四讲 课 题：在 Dreamweaver8 中使用表格布置页面 目的及要求：使用表格布置页面 教学重点：重点掌握设置表格属性的方法 教学难点：嵌套单元格设置布局表格的形式对网页进 行布局 教学课时： 2 课时 教学方法：提问与比较教学方式，激发学生兴趣； 教学内容与步骤："— Presentation transcript:

1 第四讲 课 题：在 Dreamweaver8 中使用表格布置页面 目的及要求：使用表格布置页面 教学重点：重点掌握设置表格属性的方法 教学难点：嵌套单元格设置布局表格的形式对网页进 行布局 教学课时： 2 课时 教学方法：提问与比较教学方式，激发学生兴趣； 教学内容与步骤：

2 第四讲 使用表格布局页面

3 制作电子相册 命令 —— 创建网站相册

4 插入表格 选择菜单 “ 插入 ”→“ 表格 ” 命令，或在 “ 插入 ” 工具栏 中单击 “ 表格 ” 按钮。 在弹出的 “ 表格 ” 对话框中，在 “ 表格大小 ” 区域设置 “ 行数 ” 、 “ 列数 ” 、 “ 表格宽度 ”” 、 “ 单元格边距 ” 和 “ 单 元格间距 ” 。 单击 “ 确定 ” 。文档中则出现一个表格。 在表格外的空白处单击，取消选中该表格。

5 设置表格各项属性 设置表格属性 将光标移动到表格线条上的任意位置，当 指针变成双向箭头的时候单击鼠标左键， 即可选中该表格。 选中表格，在菜单栏选择 “ 窗口 ”→“ 属性 ” 或 按下 组合键，打开 “ 属性 ” 检查器。 设置表格 “ 属性 ” 检查器中各项参数：表格 Id 、 “ 行 ” 和 “ 列 ” 、 “ 宽 ” 和 “ 高 ” 、 “ 填充距 ” 、 “ 单元 格间距 ” 、 “ 边框粗细 ” 、 “ 边框颜色 ” 、 “ 表格 背景颜色 ” 等。

6 设置表格各项属性 设置单元格属性 和设置整体表格属性操作类似，单元格的属性设 置也是在 “ 属性 ” 检查器里完成的。在所要设置属 性的单元格内任意位置单击，即选中该单元格， “ 属性 ” 检查器中显示该单元格的属性。 设置单元格 “ 属性 ” 检查器中各项参数。

7 选择表格 选择整个表格 执行以下操作之一可选择整个表格： 移动鼠标至表格的左上角、左下角、右上角或右 下角，当鼠标指针变成 时，单击鼠标左键即可选 中整个表格。 移动鼠标至表格线条上的任意位置，当鼠标指针 变成时，单击鼠标左键即可选中整个表格。 在表格中任意一个单元格内单击，然后在 “ 文档 ” 窗 口左下角的 “ 标签选择器 ” 中选择 标签即可。 在表格中任意一个单元格内单击，然后选择菜单 项 “ 修改 ”→“ 表格 ”→“ 选择表格 ” 。 在表格任意一个单元格内单击，单击鼠标右键， 在弹出的菜单中选择 “ 表格 ”→“ 选择表格 ” 选项，则 所选表格的下边缘和右边缘出现选择柄。

8 选择表格 选择行或列 移动鼠标使其指向行的左边缘或列的上边缘。当 鼠标指针变为选择箭头时，单击以选择单个行或 列，或进行拖动以选择多个行或列。 选择单元格 （ 1 ）若要选择单个单元格，请执行以下操作之一。 单击单元格内的任意位置，然后在 “ 文档 ” 窗口左 下角的标签选择器中选择 标签即可选中该单 元格。 按住 键，然后单击单元格内任意位置即可 选中该单元格 。 单击单元格，然后点击菜单选项 “ 编辑 ”→“ 全选 ” 。

9 选择表格 （ 2 ）若要选择一行或矩形的单元格块，请执行以下 操作之一。 在起始的单元格内单击鼠标左键，拖拽鼠标至最后 一个单元格。 在一个单元格内单击鼠标左键，在同一个单元格中 按住 键的同时单击以选中它，然后按住 键单击另一个单元格。这两个单元格定义的 直线或矩形区域范围内的所有单元格都将被选中。 （ 3 ）若要选择不相邻的单元格，请执行以下操作。 在按住 键的同时单击要选择的单元格、行或 列，若要选择多个单元格，只要按住 键不放 就行了。 如果按住 键单击尚未选中的单元格、行或列， 则会将其选中。如果它已经被选中，则再次单击会 将其从选择中删除。

10 编辑表格和单元格 添加行或列 （ 1 ）添加单个行或列。 选中要插入行或列的单元格，执行下列操作之一。 点击菜单选项 “ 修改 ”→“ 表格 ”→“ 插入行 ” 或 “ 修改 ”→“ 表 格 ”→“ 插入列 ” ，则在插入点的上面出现一行或在插入点的左 侧出现一列。 单击鼠标右键，在弹出的快捷菜单中执行菜单 “ 表格 ”→“ 插入 行 ” （或 “ 插入列 ” ）命令。 点击菜单选项 “ 插入 ”→“ 表格对象 ” ，然后选择 “ 在上（下）面 插入行 ” 或 “ 在左（右）边插入列 ” ，在插入点的上（下）面出 现一行或左（右）侧出现一列。 （ 2 ）添加多行或多列。 在所要添加行或列的单元格内单击鼠标右键。选择 “ 修 改 ”→“ 表格 ”→“ 插入行或列 ” ，即出现 “ 插入行或列 ” 对话框。选 择 “ 行 ” 或 “ 列 ” ，并设置 “ 行数 ” 或 “ 列数 ” 以及 “ 位置 ” 。单击 “ 确定 ” 即可插入多行或多列。相应数目的行或列出现在表格中

11 编辑表格和单元格 删除行或列 有时候我们可能要删除一些不要的行或列，若要 删除行或列，请执行以下操作之一。 （ 1 ）在要删除的行或列中的一个单元格内单击鼠 标左键，然后选择 “ 修改 ”→“ 表格 ”→“ 删除行 ” 或 “ 修 改 ”→“ 表格 ”→“ 删除列 ” 。 （ 2 ）选中要删除的行或列，然后选择菜单选项 “ 编辑 ”→“ 清除 ” 。 （ 3 ）选中要删除的行或列，按 键或 键，即可删除整个行或列。

12 编辑表格和单元格 合并单元格 在 Dreamweaver8 中，可以将相邻的两个或多个单元格合 并为一个单元格，进行合并的单元格不仅要连续，而且选 中的单元格区域必须为矩形，否则无法合并。 若要合并表格中的两个或多个单元格，请执行以下操作。 （ 1 ）选择多个连续的单元格，并确保单元格区域为矩形。 （ 2 ）执行下列操作之一。 ① 选择菜单选项 “ 修改 ”→“ 表格 ”→“ 合并单元格 ” 。 ② 在 “ 属性 ” 检查器（或选择菜单选项 “ 窗口 ”→“ 属性 ” ）中， 单击合并单元格按钮 。

13 编辑表格和单元格 拆分单元格 要拆分单元格，请执行以下操作。 （ 1 ）在要拆分的单元格内单击鼠标左键。 （ 2 ）执行下列操作之一。 ① 选择菜单选项 “ 修改 ”→“ 表格 ”→“ 拆分单元格 ” 。 ② 在 “ 属性 ” 检查器（或选择菜单选项 “ 窗口 ”→“ 属性 ” ）中， 单击 “ 拆分单元格 ” 按钮 。 （ 3 ）在 “ 拆分单元格 ” 对话框中，选择拆分单元格的行（列） 数。 （ 4 ）单击 “ 确定 ” 按钮，即可将单元格拆分为设定的行数或 列数。

14 编辑表格和单元格 剪切、复制、粘贴单元格 （ 1 ）若要剪切或复制表格单元格，请执行以 下操作。 ① 选择一个或多个连续的单元格，确保单 元格区域为矩形。 ② 单击菜单选项 “ 编辑 ”→“ 剪切 ” 或 “ 编 辑 ”→“ 拷贝 ” 。 （ 2 ）若要粘贴表格单元格，请执行以下操作。 ① 选择要粘贴单元格的位置 ② 选择菜单选项 “ 编辑 ”→“ 粘贴 ”

15 编辑表格和单元格 嵌套单元格 在 Dreamweaver8 中，表格的嵌套没有特殊的限制，表格 可以像文本、图像一样直接插入到另一个表格的单元格中。 对嵌套表格进行各种设置和普通表格一样，但是，其宽度 受它所在单元格的宽度的限制。若要在表格单元格中嵌套 表格，请执行以下操作。 （ 1 ）在要插入表格的单元格中单击鼠标左键。 （ 2 ）选择菜单选项 “ 插入 ”→“ 表格 ” ，即会出现 “ 插入表格 ” 对话框。 （ 3 ）在对话框中设置表格行数、列数等属性，单击确定 即可生成嵌套表格。

16 格式化表格 使用 Dreamweaver8 中的表格格式化功能，可以通过对话 框的简单设置方便、快速地生成表格样式。对于网页初学 者来说，使用格式化表格可以大大减少网页制作时间，提 高工作效率。格式化表格的步骤如下。 （ 1 ）选中所要格式化的表格。 （ 2 ）选择菜单选项 “ 命令 ”→“ 格式化表格 ” 。 （ 3 ）在弹出的 “ 格式化表格 ” 对话框中，可以选择不同的表 格样式，并且还可以在给定的样式上进行自定义修改，

17 格式化表格

18 排序表格 有时候，我们希望输入的表格数据有一定的规律，如按照 数字从大到小排序。在 Dreamweaver8 中，我们可以通过 “ 排序表格 ” 来对表格进行排序，可以只对单列的内容按一 定的规则进行排序，也可以对两列的内容执行更加复杂的 表格排序，但是不能对包含合并单元格的表格进行排序。 若要对表格进行排序，请执行以下操作。 （ 1 ）选择该表格或在任意单元格单击鼠标左键。 （ 2 ）选择菜单选项 “ 命令 ”→“ 排序表格 ” ，弹出 “ 排序表格 ” 对话框。 （ 3 ）设置属性后单击 “ 确定 ” ，即可。

19 排序表格

20 制作网站的首页面 1. 用 ps 或 Fireworks 切片