表格和布局表格网页.doc
PAGE1/NUMPAGES1
表格和布局表格网页
网页布局6.1利用表格进行网页布局1、创建表格2、表格及单元格的基本操作1)选中表格2)选中表格的行和列3)选中一个单元格4)选中不相邻的行、列及单元格5)增加、删除行和列6)拆分、合并单元格3、设置表格和单元格的属性4、设置表格的属性5、设置单元格的属性6、布局表格和布局单元格为了简化使用表格进行页面布局的过程,DreamweaverMX2004提供了布局视图在布局视图中,可以使用表格作为基础结构来设计我们的页面,但是却避免了使用传统的方法创建表格来设计页面时经常出现的一些问题。
例如,在布局视图中,我们可以在页面中方便地绘制布局单元格,然后将这些单元格移动到所需的位置:
我们还可以方便地创建固定宽度的布局和自动伸展为整个浏览器窗口宽度的布局。
在本节中,我们就来学习关于布局表格和布局单元格。
首先将布局视图模式打开,打开方法为:
在[1nsert](插入)栏中选择[layout](布局)选项,在[Layout](布局)选项中单击[Layoutmode](布局模式)按钮,弹出一个提示框,如图所示。
单击确定按钮便会激活布局视图工具,如图所示。
[1nsert](插入)栏中的[Layout](布局)选项1创建布局表格和布局单元格通过[1nsert](插入)栏/[Layoutl(布局)选项中的绘制布局表格按钮和绘制布局单元格按钮可以很自由地在页面中绘制布局表格和布局单元格。
1.1创建布局表格布局单元格不能脱离布局表格独立存在,每一个布局单元格都有一个容纳它的布局表格。
绘制布局表格的步骤如下:
1)选择[1nsert](插入)栏/[Layout](布局)选项,将页面切换到[Layoutmode](布局模式)下。
2)单击绘制布局表格按钮,将鼠标指针移到编辑区内,鼠标指针变成加号+。
拖动鼠标就可以在页面中创建一个布局表格,如图所示。
注意:
布局表格左上角是布局表格标签,通过标签,网页设计者可以分辨并选出布局表格上方的数字说明了布局表格的大小。
3)在绘制布局表格时,如果按住键盘中的巨司键可以绘制出多个布局表格。
1.2创建布局单元格下面讲述在页面中创建布局单元格的方法。
1)选择[1nsert](插入)栏/[Layout](布局)选项,将页面切换到[Layoutmode](布局模式)下,绘制一个布局表格。
2)单击绘制布局单元格按钮。
3)在创建的布局表格中拖动鼠标,拖拽出一个矩形框,松开鼠标左键后,即可创建出一个布局单元格,如图所示。
2布局表格和布局单元格的操作2.1改变布局表格的大小创建出布局表格后,可以重新调整它的大小,调整的方法如下:
1)在页面中单击布局表格左上角的标签,将此布局表格选中,此时在布局表格的周围会出现一些矩形点。
2).拖拽左、右边框上的矩形点可以改变布局表格的宽度。
3).拖拽上、下边框的矩形点可以改变布局表格的高度。
4).拖拽顶点上的矩形点可以同时改变布局表格的宽度与高度,如果按住键盘中的巨亘牲的同时进行拖拽,可以成比例政变布局表格的大小。
2.2改变布局单元格的大小调整布局单元格大小的方法如下:
1)在布局单元格的边框上单击鼠标左键边框线上将出现一些矩形点。
将布局单元格选中,布局单元格的2)拖拽左、右边框上的矩形点可以改变布局单元格的宽度。
3).拖拽上、下边框上的矩形点可以改变布局单元格的高度。
4).拖拽四个顶点上的矩形点可以同时改变布局单元格的宽度与高度,按住键盘中的Shift的同时进行拖拽,可以成比例改变布局单元格的大小。
2.3移动布局单元格DreamweaverMX2004允许用户对布局单元格进行移动,这个功能对于我们编辑页面非常方便,通过对布局单元格的移动,我们可以将页面中的元素拖动到页面中任意的位置上。
下面来介绍在DreamweaverMX2004中移动布局单元