5.4 排序和整理表格内容

为了更加快速而有效地处理网页中的表格和内容，Dreamweaver CC提供了多种自动处理功能，包括导入表格数据和排序表格等。

5.4.1 导入表格式数据

Dreamweaver中导入表格式数据功能能够根据素材来源的结构，为网页自动建立相应的表格，并自动生成表格数据。因此，当遇到大篇幅的表格内容编排，而手头又拥有相关表格式素材时，便可使网页编排工作轻松得多。下面通过实例讲述导入表格数据，效果如图5-28所示，具体操作步骤如下。

图5-28 导入表格式数据效果

原始文件：原始文件/05/5.4.1/index.html
最终文件：最终文件/05/5.4.1/index1.html

步骤01 打开网页文档，将光标置于要导入表格式数据的位置，如图5-29所示。

图5-29 打开网页文档

步骤02 执行“文件”|“导入”|“表格式数据”命令，弹出“导入表格式数据”对话框，如图5-30所示。

图5-30 “导入表格式数据”对话框

★知识要点★

在“导入表格式数据”对话框中可以进行如下设置。

• 数据文件：输入要导入的数据文件的保存路径和文件名，或单击右边的“浏览”按钮进行选择。

• 定界符：选择定界符，使之与导入的数据文件格式匹配。有“Tab”、“逗点”、“分号”、“引号”和“其他”5个选项。

• 表格宽度：设置导入表格的宽度。

• 匹配内容：勾选此单选按钮，创建一个根据最长文件进行调整的表格。

• 设置为：勾选此单选按钮，在后面的文本框中输入表格的宽度以及设置其单位。

• 单元格边距：单元格内容和单元格边界之间的像素数。

• 单元格间距：相邻的表格单元格间的像素数。

• 格式化首行：设置首行标题的格式。

• 边框：以像素为单位设置表格边框的宽度。

步骤03 在对话框中单击“数据文件”文本框右边的“浏览”按钮，弹出“打开”对话框，在对话框中选择数据文件，如图5-31所示。

图5-31 “打开”对话框

步骤04 单击“打开”按钮，添加到“数据文件”文本框中，在对话框中的“定界符”下拉列表中选择“逗点”选项，“表格宽度”选中“匹配内容”单选按钮，如图5-32所示。

图5-32 “导入表格式数据”对话框

★高手支招★

在导入数据表格时注意定界符必须是逗点，否则可能会造成表格格式的混乱。

步骤05 单击“确定”按钮，导入表格式数据，如图5-33所示。

图5-33 导入表格式数据

步骤06 保存文档，按F12键在浏览器中预览，效果如图5-28所示。

5.4.2 排序表格

排序表格的主要功能针对具有格式数据的表格而言，是根据表格列表中的数据来排序的。下面通过实例讲述排序表格，效果如图5-34所示，具体操作步骤如下。

图5-34 排序表格效果

原始文件：原始文件/05/5.4.2/index.html
最终文件：最终文件/05/5.4.2/index1.html

步骤01 打开网页文档，如图5-35所示。

图5-35 打开网页文档

步骤02 选中表格，执行“命令”|“排序表格”命令，弹出“排序表格”对话框。在对话框中将“排序按”设置为“列2”，“顺序”设置为“按数字顺序”，在下拉列表中选择“降序”，如图5-36所示。

图5-36 “排序表格”对话框

★高手支招★

在“排序表格”对话框中可以设置如下。

• 排序按：确定哪个列的值将用于对表格排序。

• 顺序：确定是按字母还是按数字顺序以及升序还是降序对列排序。

• 再按：确定在不同列上第二种排列方法的排列顺序。在其后面的下拉列表中指定应用第二种排列方法的列，在后面的下拉列表中指定第二种排序方法的排序顺序。

• 排序包含第一行：指定表格的第一行应该包括在排序中。

• 排序标题行：指定使用与body行相同的条件对表格thead部分中的所有行排序。

• 排序脚注行：指定使用与body行相同的条件对表格tfoot部分中的所有行排序。

• 完成排序后所有行颜色保持不变：指定排序之后表格行属性应该与同一内容保持关联。

步骤03 单击“确定”按钮，对表格进行排序，如图5-37所示。

图5-37 对表格进行排序

★高手支招★

如果表格中含有合并或拆分的单元格，则无法使用表格排序功能。

上一章目录下一章