7
Chapter
使用表格排列网页数据
7.5.4 实例4——国字型布局网页
国字型布局常用于主页布局，下面通过实例讲述国字型布局网页的制作，具体操作步骤如下。
最终文件 学习要点 CH7/7.5.4/index1.html 制作国字型布局网页 ? 选择菜单中的【文件】|【新建】命令，创建一空白文档，如图7-51所示。
? 选择菜单中的【文件】|【另存为】命令，弹出【另存为】对话框，在对话框中的【名称】文本框中输入index1，如图7-52所示。
图7-51 新建文档 图7-52 【另存为】对话框
? 单击【保存】按钮，保存文档。选择菜单中的【插入】|【表格】命令，弹出【Table】对话框，如图7-53所示。
? 在对话框中将【行数】设置为1，【列数】设置为1，【表格宽度】设置为780像素，单击【确定】按钮，插入表格，此表格设置为表格1，如图7-54所示。
图7-53 【Table】对话框 图7-54 插入表格1
? 将光标放置在单元格中，选择菜单中的【插入】|【图像】命令，弹出【选择图像源文件】对话框，在对话框中选择“images/banner.jpg”文件，如图7-55所示。
1 130 7.5 实例——利用表格布局网页
? 单击【确定】按钮，插入图像，如图7-56所示。
图7-55 【选择图像源文件】对话框 图7-56 插入图像
? 将光标置于表格1的右边，选择菜单中的【插入】|【表格】命令，插入2行1列的表格，此表格设置为表格2，如图7-57所示。
? 将光标放置在表格2的第1行单元格中，选择菜单中的【插入】|【图像】命令，弹出【选择图像源文件】对话框，在对话框中选择“images/topbj.jpg”文件，单击【确定】按钮，插入图像，如图7-58所示。
图7-57 插入表格2 图7-58 插入图像
? 将光标放置在表格2的第2行单元格中，选择菜单中的【插入】|【表格】命令，插入1行5列的表格，此表格设置为表格3，如图7-59所示。
? 将光标放置在表格3的第1列单元格中，在【属性】面板中将【宽】设置为7，【背景颜色】设置为#198402，如图7-60所示。
将光标放置在表格3的第2列单元格中，选择菜单中的【插入】|【表格】命令，插入5行1列的表格，此表格设置为表格4，如图7-61所示。
将光标放置在表格4的第1行单元格中，输入文字，如图7-62所示。
将光标放置在表格4的第2行单元格中，在【属性】面板中将【高】设置为15，如图7-63所示。
131 1
7.5.4 实例4——国字型布局网页[共6页]
