第五章 网页中表格的处理汇编

4.1.6 导入表格数据文件
选择“文件”|“导入”|“表格式数据”命令。
选择“插入”|“表格对象”|“导入表格式数 据” 命令。
4.1.7 用表格进行页面布局
Dreamweaver8提供了一种新的网页排版视图—
—布局视图（Layout View）。
1. 打开“布局”面板 2. 绘制布局表格或布局单元格。
选择“表格”|“删除行”或“删除列”命令。
3．修改表格大小
（1）设置表格的宽度及高度 ① 通过鼠标拖曳法可以粗略地调整表格的大小。 ② 通过“表格属性”面板可以精确地调整表格的大 小。
（2）设置单元格的宽度及高度 将光标置于需要设置宽度或高度的单元格中，此Leabharlann 时属性面板显示单元格属性。
在属性面板上的“宽”或“高”文本框中输入适 当的数值即可。
5．在表格中添加文字和图片
（1）在表格中添加文字
在表格内按要求输入文字，调整文字的字号、
字体、对齐方式等。 （2）在表格中插入图片 选中要插入图片的单元格，选择“插 入”|“图
像”菜单命令，打开“选择图像源”对话框，
在对话框中选择图像，选中图像文件之后， 单击“确定”按钮。
4.1.3 表格属性的设置
• • • •
行数：初次指定表格的总行数。 列数：初次指定表格的总列数。 单元格填充：指定单元格的大小，以像素为单位。 单元格间距：指定单元格之间的距离，以像素为单位。 分比用于根据浏览器窗口的大小来自动调整表格的宽
• 宽度：指定表格的宽度，以百分比或像素为单位（百
度）。 • 边框：指定表格边界的宽度，以像素为单位（如果在 浏览器窗口中不显示表格的边框，则定义为0）。
3．TR
用于定义表格的行，对于每一个表格行，都对应 一个TR标记符，它的结束标记符可以省略。
4．TD和TH
在表格行中的每个单元格，都对应于一个TD标记 符或者TH标记符，用于标记表格的内容，其中可以包 括文字、图像或其他对象。
4.2.2 表格的编辑及属性设置
1．合并单元格
行合并：在 <TD> 和 <TH> 标记内使用 rowspan 属性，
选择表格，单击其属性面板上“边框颜色” 的 颜 色框 ，在弹出的调色板中选择颜色，或 者是在后面的文本框中直接输入颜色色码。 在表格属性面板上的“边框”文本框中输入 边 框的宽度数值。
4.1.4 表格的排序
1. 单击表格中的任一单元格 ，执行主菜单中的 “命令”|“排序表格”命令，打开 “排序表格” 对话框； 2. 在“排序按”下拉列表框中选择要排序的列
（2）选择单个单元格： 将光标置于所要选择的单元格中，按一次组合键 “Ctrl+A”。 将 光 标 置 于 所 要 选 择 的 单 元 格 中 ， 选 择 “ 编
辑”|“全选”命令。
按住Ctrl键，单击所要选择的单元格，再单击一次
则取消对单元格的选择。
（3）选择多个单元格： 按住Ctrl键，单击所要选择的所有单元格。 将光标置于单元格中，拖动鼠标，选择多个单元 格。
数。
3．控制单元格空白
在 TABLE 标记符中使用 cellspacing 属性可以控 制单元格之间的空白，使用 cellpadding 属性可以
控制表格分隔线和数据之间的距离，这两个属性之
间的取值通常采用像素数。
4．表格的对齐
表格的页面对齐 ① 在TABLE标记符中使用align属性。
② 用 DIV 标记符的 align 属性：将 TABLE 标记符
（第一关键字），在“顺序”下拉列表框中选
择所需顺序； 3. 在“再按”下拉列表框中选择要进行次级排序 的顺序； 4. 单击“确定”按钮完成设置。
4.1.5 表格的格式化
选择一个表格，然后执行主菜单中的“命
令”|“格式化表格”命令，打开“格式化表格”对
话框，从中选择一种模板方案，再对各选项进一步 自定义设置，最后应用于自己所设计的表格中。
rowspan的取值表示垂直方向上合并的行数。
列合并：在 <TD> 和 <TH> 标记内使用 colspan 属性，
colspan的取值表示水平方向上的合并的列数。
2．边框与分隔线
frame属性用于控制表格最外层的四条框线。 rules 属性用于控制是否显示单元格之间的分隔。 border 属性用于设置边框的宽度，其值为像素
4．合并/拆分单元格
（1）合并单元格 选择“修改”|“表格”|“合并单元格”命令。 单击鼠标右键，选择“表格”|“合并单元格”命令。 按组合键“Ctrl+Alt+M”。
（2）拆分单元格 选择“修改”|“表格”|“拆分单元格”命令。 单击鼠标右键，选择“表格”|“拆分单元格” 命 令。 按组合键“Ctrl+Alt+S”。
包含在<DIV align=“”>和</DIV>之间。 表格的内容对齐 在标记符ＴＲ、ＴＨ、 ＴＤ中使用align属性；
5．控制表格和单元格的大小
表格在网页中更多地是用作排版工具，要分割
页面区域，就是设置表格和单元格大小。
可以使用标记符的 width 和 height 属性设置表 格和单元格大小，这两个属性的取值可以是像素数， 也可以是百分比，但一般都使用绝对的像素数。
将光标移到要插入行或列附近的单元格中单击鼠标右键选择表格插入行或列命令或是选择修改表格插入行或列命令在弹出的插入行或列对话框中进行相关的设置然后单击确定按钮
第5章 网页表格的处理 主要内容：
1. 2. 3. 4. 5. 6. 创建表格 编辑表格的方法 设置表格属性 用表格布局页面 表格的格式化方法 表格的排序方法
6．设置表格和单元格的背景
设置表格或单元格背景颜色或图案方法为： 在 TABLE 、 TR 或 TD 标记符内使用 bgcolor 属性
设置背景颜色；
在TABLE、TR或TD标记符内使用background 属 性设置背景图案。
4.2 利用HTML处理网页表格
4.2.1 表格的基本构成 1．TABLE
用于定义整个表格，表格内的所有内容都应该 位于<TABLE>和</TABLE>之间。
2．CAPTION
表格标题应包括在 <CAPTION> 和 </CAPTION> 之 间。CAPTION标记符的格式为： <CAPTION align=" "> 标题 </CAPTION>
如果要选择整行，将光标置于该行的左边缘，当
光标变成图标时单击鼠标左键。
如果要选择整列，将光标置于该列的上边缘，当
光标变成图标时单击鼠标左键。
（4）选择的全部单元格： 将光标置于第 1 个单元格中，拖动鼠标至最后一 个单元格。
将光标置于第1行的左边缘，当光标变成图标时，
向下拖动鼠标至最后一行。 向右拖动鼠标至最后一列。
（3）在表格中添加多行或多列： 将光标移到要插入行或列附近的单元格中，单击 鼠标右键，选择“表格”|“插入行或列”命令，或是 选择“修改” |“ 表格” |“ 插入行或列”命令，在弹出 的“插入行或列”对话框中进行相关的设置，然后单 击“确定”按钮。
（4）删除整行/整列： 先选择欲删除的整行或整列，直接按Del键。 先 将 光 标 移 到 要 删 除 的 行 或 列 中 ， 选 择 “ 修 改”|“表 格”|“删除行”或“删除列”命令。 将光标移到要删除的行或列中，单击鼠标右键，
4.1.2 编辑表格 1．选择表格
（1）选择整个表格： 将 光 标 置 于 某 个 单 元 格 中 ， 选 择 “ 修 改 ” |“ 表 格”|“选择表格”命令。 将光标置于某个单元格中，按两次组合键“Ctrl+A”。 将光标置于某个单元格中，单击鼠标右键，选择 “表 格”|“选择表格”命令。 单击表格的边线。
将光标置于第1列的上边缘，当光标变成图标时，
2．添加/删除行列
（1）表格中插入单元行： 选择“修改”|“表格”|“插入行”命令。 按组合键“Ctrl+M”。 单击鼠标右键，选择“表格”|“插入行”命令。
（2）在表格中插入单元列： 选择“修改”|“表格”|“插入列”命令。 按组合键“Ctrl+Shift+A”。 单击鼠标右键，选择“表格”|“插入列”命令。
4.1 利用Dreamweaver8处理网页表格
4.1.1 创建表格
1．新建表格
（1）在插入“常用”面板上，单击插入表格按钮 。 （2）在插入“常用”面板上，拖动表格按钮 到主 窗 口的工作区中。 （3）通过主窗口的菜单“插入”|“表格”命令。 （4）使用快捷组合键“Ctrl+Alt+T”。
执行完上述任何一种操作，都可以看到的“插入 表格”对话框。
1．设置表格的背景
设置颜色背景 在弹出的调色板中选择颜色，或者是在后面的文
本框中直接输入颜色色码。 设置图像背景 在属性面板上的“背景图像”文本框中输入 图像所在的路径，或是单击其后的文件夹图标，
通过属性面板上“背景颜色”后面的颜色框，
在弹出的对话框中选择图像文件。
2．设置表格的边框颜色和宽度