网页制作三合一实用教程王爱赪杜金郭海1第三章.pptVIP

第3章框架、层与网页布局 本章要点 3.1 “北京建筑浏览”网页 3.2 “咨询公司”网页 3.3 “中国国际人才发展中心”网页 3.1 “北京建筑浏览”网页 3.1 “北京建筑浏览”网页 3.1 “北京建筑浏览”网页 3.1 “北京建筑浏览”网页 3.1 “北京建筑浏览”网页 3.1 “北京建筑浏览”网页 3.1 “北京建筑浏览”网页 3.1 “北京建筑浏览”网页 3.1 “北京建筑浏览”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.2 “咨询公司”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 3.3 “中国国际人才发展中心”网页 1．“绘制布局表格”按钮的作用 （1）单击按下“布局视图”按钮，即可进入网页的“布局视图”状态（以前是“标准模式”状态）。同时，“布局”栏中的按钮变为有效。 （2）单击选中“布局”栏中的“绘制布局表格”按钮，再用鼠标在设计窗口内拖曳，即可绘制出一个绿色线条的表格，如图3-3-2所示。 2．“绘制布局单元格”按钮的作用 （1）在绘制表格后，单击选中“布局”栏中的“绘制布局单元格”按钮，再用鼠标在设计窗口内拖曳，即可绘制出一个单元格。重复上述过程，最终效果如图3-3-3所示。 （2）如果没有绘制布局表格就绘制布局单元格，则会自动产生一个布局表格。注意：不可以在布局单元格内绘制布局表格和布局单元格。 图3-3-2 绘制的布局表格 图3-3-3 绘制的布局单元格 3.3.2 网页布局的调整与设置 1．网页布局的调整 （1）选中布局表格。单击布局表格内部或它的标签，即可选中布局表格。选中的布局表格的四周会出现3个控制柄和布局表格宽度标注，如图3-3-2所示。 （2）调整布局表格的大小与位置。用鼠标拖曳布局表格的标签，即可改变布局表格的位置；用鼠标拖曳布局表格的绿色控制柄，即可改变布局表格的大小。注意：不能将布局表格调整到比其中的单元格还小，也不能将布局表格移到其他布局表格之上。 （3）选中布局单元格。将鼠标指针移到布局单元格的蓝色线条处，布局单元格的线条会变为红色，此时单击布局单元格的线条，即可选中布局单元格。选中的布局单元格四周会有8个控制柄，如图3-3-3所示。 （4）调整单元格的大小与位置。选中单元格后，用鼠标拖曳单元格线条，即可改变单元格的位置；用鼠标拖曳单元格的控制柄，即可改变单元格的大小。注意：不能将单元格移出所在的布局表格，也不能将单元格移到其他单元格之上。 2．布局表格的“属性”栏 单击选中布局表格后，即可调出布局表格的“属性”栏，它与表格的“属性”栏不一样，如图3-3-4所示。布局表格“属性”栏内各选项的作用如下。 图3-3-4 网页布局表格“属性”栏 （1）“宽”栏：它有两个单选钮——“固定”和“自动伸展”。选择“固定”单选钮后，还需要在其文本框内输入布局表格的宽度数值（单位为像素）。 （2）“高”文本框：用来输入布局表格的高度数值（单位为像素）。 （3）“背景颜色”按钮与文本框：用来确定布局表格的背景颜色。 （4）“填充”文本框：用来输入布局表格内布局单元格中插入的对象距边线的距离数值（单位为像素）。该值为0时，如图3-3-5所示；该值为15时，如图3-3-6所示。 （5）“间距”文本框：用来输入布局表格内各布局单元格与空图像之间的间距数值（单位为像素）。该值为0时，如图3-3-5所示；该值为10、填充值为15时，如图3-3-7所示。