部分网页布局.pptVIP

设置指定宽度：并不是所有的列都适合于自动伸展宽度，有时需要精确指定列的宽度，可单击“属性”面板的“固定”文本框中，然后输入数值。如果输入的数值小于内容的宽度，Dreamweaver会自动设置宽度到正确的大小。 第159页/共159页 单击“布局”栏中的“布局表格”按钮 ，再用鼠标在设计窗口内拖曳，即可绘制出一个绿色线条的表格，如图3-4-2所示。 第127页/共159页 图3-4-2 单击 按钮后绘制的布局表格 第128页/共159页 （2）“绘制布局单元格”按钮的作用 在绘制表格后，单击“布局”栏中的“绘制布局单元格”按钮 ，再用鼠标在设计窗口内拖曳，即可绘制出一个单元格。重复上述过程，最终效果如图3-4-3所示。 第129页/共159页 图3-4-3 单击 按钮后绘制的布局单元格 第130页/共159页 如果没有绘制布局表格就绘制布局单元格，则会自动产生一个布局表格。注意：不可以在布局单元格内绘制布局表格和布局单元格。 第131页/共159页 （1）网页布局的调整 选中布局表格：单击布局表格内部或它的标签 ，即可选中布局表格。选中的布局表格的四周会出现3个控制柄和布局表格宽度标注，如图3-4-2所示。 2．网页布局的调整与设置 第132页/共159页 调整布局表格的大小与位置：用鼠标拖曳布局表格的标签，即可改变布局表格的位置；用鼠标拖曳布局表格的绿色控制柄，即可改变布局表格的大小。注意：不能将布局表格调整到比其中的单元格还小，也不能将布局表格移到其他布局表格之上。 第133页/共159页 选中布局单元格：将鼠标指针移到布局单元格的蓝色线条处，布局单元格的线条会变为红色，此时单击布局单元格的线条，即可选中布局单元格。选中的布局单元格四周会有8个控制柄，如图3-4-3所示。 第134页/共159页 调整单元格的大小与位置：选中单元格后，用鼠标拖曳单元格线条，即可改变单元格的位置；用鼠标拖曳单元格的控制柄，即可改变单元格的大小。注意：不能将单元格移出所在的布局表格，也不能将单元格移到其他单元格之上。 第135页/共159页 （2）布局表格的“属性”栏 选中布局表格后，即可弹出布局表格的“属性”栏，它与表格的“属性”栏不一样，如图3-4-4所示。布局表格“属性”栏内各选项的作用如下。 第136页/共159页 图3-4-4 网页布局表格的“属性”栏 第137页/共159页 “宽”栏：它有两个单选项，即“固定”和“自动伸展”。选中“固定”单选项后，还需要在其文本框内输入布局表格的宽度数值（单位为像素）。 ? “高”文本框：在其内输入布局表格的高度数值（单位为像素）。 ? “背景颜色”按钮与文本框：用来确定布局表格的背景颜色。 第138页/共159页 “填充”文本框：用来确定布局表格内布局单元格中插入的对象距边线的距离（单位为像素）。该值为0时，如图3-4-5所示；该值为15时，如图3-4-6所示。 第139页/共159页 图3-4-5 “填充”值为0 第140页/共159页 图3-4-6 “填充”值为15 第141页/共159页 “间距”文本框：用来确定布局表格内各布局单元格与空图像之间的间距（单位为像素）。该值为0时，如图3-4-5所示；该值为15时，如图3-4-7所示。 第142页/共159页 图3-4-7 “间距”值为15 第143页/共159页 “清除行高”按钮 ：单击该按钮可清除行高。 ? “宽度一致”按钮 ：使单元格宽度一致，创建宽度相同的单元格。 ? “删除间隔图像”按钮 ：删除所有的间隔图像。它在添加间隔图像后才会有效。 ? “删除嵌套”按钮 ：删除嵌套在布局表格内的选中的布局表格。 第144页/共159页 （3）布局表格和布局单元格菜单 单击选中布局表格，再单击总宽度标注右边的箭头，可弹出布局表格菜单，如图3-4-8所示。单击单元格宽度标注右边的箭头，可弹出布局单元格菜单，如图3-4-9所示。各菜单命令的作用如下。 第145页/共159页 图3-4-8 布局表格菜单 第146页/共159页 图3-4-9 布局单元格菜单 第147页/共159页 “清除所有高度”：单击它后，可将布局表格内的单元格的高（单元格顶部与布局表格顶端的间距）清除。如果布局表格内没有单元格，则自动建立充满布局表格的单元格。 ? “使所有宽度一致”：使所有布局单元格的宽度一样。 ? “移除所有分隔符图像”：删除所有的间隔图像。 第148页/共159页 “删除嵌套”：删除选中的布局表格中的间隔图像。 ? “列设置为自动伸展”