使用布局视图设计网页布局

方法一：选择查看 > 表格视图 > 布局视图
方法二：点击对象面板中的布局视图按钮。

在排版视图中可以使用下列工具按钮：

• 布局单元格：用于排版表格中的单元格。
• 布局表格：用于排版整个表格。

　注：只有在布局视图下才能使用布局单元格与布局表格按钮。

1 画布局单元格与布局表

　在布局视图中，可以在页面上画布局单元格和布局表。如果先创建布局单元格，布局表也将作为布局单元格的容器自动插入。布局单元格将总是处于布局表中。

　注：由Dreamweaver自动创建的布局表的宽度等于文档窗口的宽度。必要时可以调整其大小或使其自动伸缩。

一.画布局表

1)在布局视图中，点击画布局表按钮。鼠标指针变成加号(+)。
2)定位鼠标指针到页面上，然后点击并拖动鼠标来创建布局表。如果是在页面上画的第一个布局表，将自动被定位于页面的左上角。
　要创建多个表又不想每次都点击布局表按钮，在拖画布局表时按住Control键。

说明：
　１.布局表在页面上显示为绿色边框。布局表标签出现在每个表格的顶端并帮助区分和选取表格。每个布局表的大小显示在表格顶端的列标题区域中。
　2.布局表不能互相交叠。Dreamweaver自动对齐创建的新表格到现有的表格或单元格，如果离页面边缘很近的地方画表格（8像素以内）。要关闭对齐，在页面上画表格时按住Alt键。
　3.可以创建布局表格到页面布局的空白区域，到现有布局表格中（嵌套），或在现有单元格和表格周围。当在空白文档中创建一个布局表格时，它会自动对齐到的文档窗口的左上角。

二.画布局单元格：

1)在布局视图中，点击对象面板布局类别中的画布局单元格按钮,鼠标指针将变为加号(+)。
2)定位鼠标指针到页面上要开始画单元格的地方，然后拖动鼠标指针来创建布局单元格。要创建多个单元格又不想每次都点击布局单元格按钮，拖画时按住Control键不放。

　单元格在页面上显示为蓝色边框。蓝色是布局单元格的默认边框颜色。每个单元格的大小显示在单元格上方的列标题区域中。

　说明：
　１.单元格之间不能重叠。
　２.在画布局单元格时，Dreamweaver会通过自动对齐新单元格到现有的单元格，如果画单元格时彼此离的很近（8个像素内）。 单元格自动对齐于页边，如果在离页面边缘很近的地方画单元格（8个像素内）要临时禁止对齐，在页面上画单元格时按住Alt键。
　３.所有单元格不必是同一大小或宽度。可以在同一列中有不同宽度的单元格，或在同一行中有不同高度的单元格。

三.画嵌套的布局表格

　可以在已有的布局表中画一个布局表（创建一个嵌套的表格）。嵌套表格内部的单元格不受外部表格的行列限制。可以插入多个嵌套的表格。

1)点击对象面板布局类别中的画布局表格按钮。鼠标指针变为加号 (+)。
2) 在已有布局表的灰色空间内定位鼠标指针，然后点击并拖动鼠标创建嵌套的布局表格。

注：嵌套的布局表格不能大于包含它的表格。

2 添加内容到单元格中

一.添加文本到单元格

　在需要添加文本的布局单元格中点击并执行以下任一操作：

• 在单元格中输入文本。单元格在输入过程中会自动扩展。
• 用Paste命令粘贴从其它文档拷贝过来的文本。

二.添加图像到单元格：

　在要加入图像的布局单元格中点击并执行以下任一操作：

• 点击对象面板中插入图像按钮
• 选择插入> 图象命令，
• 从对象面板中拖动插入图象按钮到页面上

注：内容仅可以被插入到布局单元格内，因此必须首先创建布局单元格。页面中的灰色空间表示不可用来添加内容的区域。
　　当加入的内容大于单元格时布局单元格将自动扩展。在单元格扩展的同时，周围的单元格也会受影响，单元格所在的列也会随之扩展。

3 调整布局单元格与布局表

一.清除自动设置的单元格高度

在插入内容到单元格之后，可以清除自动设置的单元格高度。要清除高度，执行以下任一操作：

• 从列标题菜单中选择清除单元高度。高度被清除且某些行可能会收缩。
• 选中布局表(点击表格标签或边缘），然后点击属性检查器中的清除行高按钮。

练习8-５
　清除已插入文字和图象单元格的自动设置的高度。

二.移动和调整布局单元格与布局表

1.调整单元格大小

1) 点击单元格边缘或按住Control)键并点击单元格,选取手柄将出现在单元格四周。
2) 使用选取手柄拖动单元格到想要大小。

2.移动单元格：

1)点击单元格边缘。
2)在页面上拖动单元格或用箭头键移到想要的地方。箭头键每次移动单元格1像素，按住Shift键将每次移动单元格10像素。

3.调整表格大小：

1 点击表格标签,选取手柄将出现在布局表四周。
2 用选取手柄拖动表格到想要的大小。

4.移动表格：

1) 点击表格标签。
2) 在页面上拖动表格或用箭头键移到想要的地方。箭头键每次移动表格1像素，按住Shift键将每次移动表格10像素。

4 格式化

一.格式化布局单元格

　可以在属性检查器中设定布局单元格内容对齐方式，宽度和高度，以及背景色。

1）点击单元格边缘或按住Control键并点击单元格。
2）选择窗口> 对象打开属性检查器。
3）选择以下外观选项：

• 要改变宽度，选择固定并在随后的框中以像素单位输入宽度值。或者选择自动伸展。
• 要改变高度，在高度框中以像素单位指定高度值。
• 要设置布局单元格背景色，从背景颜色下拉颜色拾取器中选择一种颜色或在框中输入想要颜色的十六进制码。
• 要设置水平对齐方式，从水平弹出菜单中选择。
• 要设置垂直对齐方式，从垂直弹出菜单中选择。
• 选中不换行可以防止自动换行。如果未选中该选项，布局单元格拓宽以容纳所有内容，而不换行。

二.格式化布局表

　可以在属性检查器中设置布局表宽度与高度，补白与间隔及其它更多选项。

1） 点击表格标签或边缘；打开属性检查器。
2） 选择以下外观选项：

• 改变宽度，选中固定，并在后面的框中输入像素单位的宽度值，或选择自动伸展。
• 改变高度，在高度框中指定像素单位的高度值。
• 设置表格内文本与单元格边界的距离，在边距域中指定像素数。
• 设置表格内单元格间隔，在间距域中指定像素数。
• 要清除选中布局表中所有单元格的高度设定，点击清除高度属性按钮。如果表格中没有元素，表格将完全收缩。
• 如果在布局中有固定宽度单元格，点击保持宽度一致按钮。将自动重置每个单元格的宽度以匹配单元格内的内容。
• 要从布局表中删除间隔图像（用来控制布局间隔的透明图像），点击删除所有间隔图像按钮.
• 如果选择的布局表嵌入在其它布局表中，点击删除嵌套来删除嵌套的布局表但不丢失其内容。嵌套布局表将消失，而布局单元格和它们的内容将成为父表的一部分。

　注：在布局视图中可以使用两种类型的宽度：固定宽度与自动伸展。宽度出现在每一列顶部的列标题区域。固定宽度是一个特定的数值宽度，显示为一个数字。自动伸展设置宽度为依赖窗口尺寸自动调整大小且显示为波浪线。