网页设计与制作之表格的处理

实验三网页表格的处理
【实验目的】
通过本实验，使学生熟悉表格的基本操作和如何利用表格进行页面布局的方法。

【实验要求】
[1] 掌握在页面中创建、编辑表格、设置表格属性的方法；
[2] 熟悉文本数据与表格数据之间的导入导出方法；
[3] 掌握利用表格技术对页面进行布局的方法。

【实验内容】
[1] 创建一个嵌套表格，在表格中添加文字和图片，如图1“彩色天气预报表”所示；
[2] 利用表格定位与布局技术来制作一个网页，如图2“网页布局”所示,可参照给出的网页来制作。

图1“彩色天气预报报表”
图2“网页布局”
“彩色天气预报报表”页面的制作
【实验步骤】
1、首先在制作出如下所示的表格：
标准视图
布局视图
2、设置最外层的表格的属性值，见其属性面板：
设置效果如下图所示：
3、格式化嵌套表格如下图所示：
4、输入文字，并设置相应格式，最终效果如下图所示：
“网页布局”页面的制作
【实验步骤】
1、首先，网页的布局遵循从大到小的的布局原则。

所以我们在布局之前，先要确定整幅页面需要分成几个部分。

此例我们分为四个部分：
标题部分（ 760 ╳ 70 ）
导航部分（ 760 ╳ 44 ）
具体内容（ 760 ╳ 270 ）
说明部分（ 760 ╳ 36 ）
2、导航部分又可分为导航区和位置搜索区，故共应插入 5 个 1 ╳ 1 ，宽度 760 像素边距、间距、边框皆为 0 的布局表格，如图：
3、“具体内容”部分又分成三个小区，即又需要创建三个嵌套布局表格，如图：
4、在各布局表格中插入需要的布局单元格，因为所有的内容只能插入到布局单元格里。

5、着色背景，格式化布局。

6、添加相应的网页元素到表格中，最终效果如下图所示：。