自从鸣涧上次给阿蒙卖了一个关子后，家里的电话总是响个不停，阿蒙按照上次鸣涧所说的方法制作出来的主页，总是感觉没有别人的好，版面格式编排设计也不满意，心里很不平衡。打了一百多个电话后，鸣涧终于不耐烦了，“好了，好了，我求求你千万别打电话了。在网页制作过程中，表格的应用是非常广泛的，在表格中组织和编排文本图形会更加灵活，可以制作别具一格的网页作品，我现在就告诉你如何使用表格吧。”

还别说，阿蒙一边听着电话那边鸣涧说，一边在电脑上操作，就基本掌握表格使用了，“哈哈，原来如此简单”。放下电话后，阿蒙决定自己再温习一下，仔细琢磨琢磨如何在Dreamweaver中使用表格。

插入第一个表格

我们要设计的网页的布局是，在页面最上方放置Logo和Banner广告条，中间的部分为栏目导航，下方为网页正文。单击“对象面板”中的插入表格图标，弹出“Insert Table”对话框（如图1）。设置Rows(行数)为“1”，Columns(列数)为“2”，表格Width(宽度)为“75Percent”， Border(表格线宽度)为“0”，完成后单击“OK”按钮。

图1

表格的属性

将光标放置在表格的第一个单元格中，此时在状态栏左侧的标签选择器处会显示“{body}{table}{tr}{td}”，如果点击“table”则选择整个表格，“tr”选中当前行，“td”选中单元格，现在“td”被加粗显示，说明光标处在单元格内。单击一下{table}，此时表格周围显示一圈黑线，表示表格被选中，四周同时有黑色方块，可以拖动来改变表格的大小。

选中表格后，打开“属性”，可以查看表格属性，如果要改变表格属性，可以在“属性”中进行相关的修改(如图2)。

图2

插入图形

在第一个单元格内插入Logo图片，然后选中图片，发现图片宽度为205个像素，然后调整此单元格宽度也为205像素，这样单元格刚好可以容纳刚才插入的图形。完成后，再次选中图片，在“属性”中设置图形“Border”值为“1”。同样道理将Banner图形插入第二个单元格，同时选择第二个单元格，并在“属性”面板中单击“居中对齐”方式，使Banner图形居中显示。

制作栏目导航

打算设计栏目为5个，所以插入一个1行5列的表格，此时设置表格“boder”值为1，“Cell Spacing(单元格间距)”为“0”。选中插入的表格，在“属性”面板中设置表格高度(H)为“30 Pixels”(如图3)。

图3

制作立体导航

选中表格，在“属性”面板中设置“Cellspace”为“1”，设置“Bg Color(背景颜色)”值为“#000000”，“Brdr color”为“#FFFFFF”。接着单击状态栏“tr”，选中当前行，在“属性”面板中，设置“BG”为“#99CC99”，“Brdr”为“#FFFFFF”（如图4），这样就可以制作出一个带有立体效果的单航边框了。然后在表格中加入栏目名称，并使文字居中显示。

图4

设计正文区

在正文区域插入一个3行2列的表格，然后选中第一行两个单元格，点击鼠标右键，执行“Table/Merge cell”命令合并两个单元格并设置其背景色(BG)为“#CCCC99”。接着调节第2、3行的列宽，并合并2行2列、3行2列，并将正文插入到合并后的表格中。再设定左侧1列BG值为“#009966”，同时还可以根据自己的需要插入新的表格，并设定相关的内容，这里就不多说了。

基本设计好了，阿蒙觉着自己的主页漂亮多了。于是赶紧向鸣涧报告战果，当然啦，还得告诉鸣涧下次可得快些去他那里，否则电话就别想消停^_^。