用表格布局页面的方法和技巧

1、logo计（计（2）班）班 张明晶张明晶用表格布局页面的方法和技巧logopage 2表格在网页设计中的作用？表格在网页设计中的作用？n表格是现代网页制作的一个重要组成部分。表格是现代网页制作的一个重要组成部分。 表格之所以重要是因为表格可以实现网页表格之所以重要是因为表格可以实现网页的精确排版和定位，还可以利用表格来美的精确排版和定位，还可以利用表格来美化网页。化网页。n当我们使用过表格，把单元格间距归零，当我们使用过表格，把单元格间距归零，就可以去掉表格边框。就可以去掉表格边框。logopage 3 将一定的内容按特定的行、列规则进行将一定的内容按特定的行、列规则进行排列就构成了表格。排列

2、就构成了表格。 无论在日常生活和工作无论在日常生活和工作中还是在网页设计中，表格通常都可以使信中还是在网页设计中，表格通常都可以使信息更容易理解。在息更容易理解。在dreamweaver mx中，我中，我们可以方便地创建出各种规格的表格，并能们可以方便地创建出各种规格的表格，并能对表格进行特定的修饰，从而使网页更加生对表格进行特定的修饰，从而使网页更加生动活泼。表格中可以将各种数据动活泼。表格中可以将各种数据(包括文本、包括文本、图像、表单、表单域以及其他表格等图像、表单、表单域以及其他表格等)排成行排成行和列，从而获得特定的表格效果。和列，从而获得特定的表格效果。logopage 4活用表格

3、美化网页活用表格美化网页n 1 1、一个象素宽的分隔线；一个象素宽的分隔线；n 有时候在网页排版时，我们需要一条细线，用图片似乎有点劳师动众有时候在网页排版时，我们需要一条细线，用图片似乎有点劳师动众了，其实，这个小问题用表格就能搞定。了，其实，这个小问题用表格就能搞定。n 在在dreamweaverdreamweaver中插入一个一行一列的表格，表格的属性面板设置如中插入一个一行一列的表格，表格的属性面板设置如下：下：n 说明：其实就是一个高为说明：其实就是一个高为“1pix”“1pix”的表格，需要注意的是表格内不要的表格，需要注意的是表格内不要有其他任何内容。如果你还需要其他颜色的分隔线

4、，只需要改变表格有其他任何内容。如果你还需要其他颜色的分隔线，只需要改变表格的背景色的背景色 bgcolor bgcolor 就可以了。利用这种方法我们还可以制作出细竖就可以了。利用这种方法我们还可以制作出细竖线，将表格的宽该为线，将表格的宽该为“1”“1”就可以了。就可以了。logopage 52 2、圆角表格的制作、圆角表格的制作n 做两个圆角的图片，这两做两个圆角的图片，这两个图片可以先做一个图片，个图片可以先做一个图片，然后用相关软件垂直翻转然后用相关软件垂直翻转一下就行了一下就行了n 在两个图片中间插入一个在两个图片中间插入一个背景颜色同图片一样的表背景颜色同图片一样的表格，长度也设

5、为图片的长格，长度也设为图片的长度，将这个表格的度，将这个表格的cellpadcellpad（设置文字与格（设置文字与格子的距离）设为子的距离）设为1 1，其他，其他都为都为0 0。logopage 6n 将表格的单元格背景色设将表格的单元格背景色设置为白色（从置为白色（从2 2、3 3两步可两步可以看出这里其实是制作了以看出这里其实是制作了一个细线边框的表格）。一个细线边框的表格）。n 最后我们就可以在表格里最后我们就可以在表格里面填写内容了，我们可以面填写内容了，我们可以把这个部分当然一个整体，把这个部分当然一个整体，复制并粘贴到页面上不同复制并粘贴到页面上不同的地方，当然你也可以改的地方

6、，当然你也可以改变整个圆角表格的尺寸，变整个圆角表格的尺寸，要做的就是改变圆角图片要做的就是改变圆角图片和插入表格的尺寸了。和插入表格的尺寸了。logopage 73、两个并列的表格、两个并列的表格n 有时候我们需要把两个单独的表格并排排列，但有时候我们需要把两个单独的表格并排排列，但是当我们连续插入两个表格的时候，表格会自动是当我们连续插入两个表格的时候，表格会自动分成上下排列，如何解决这个问题呢？分成上下排列，如何解决这个问题呢？n 利用表格的嵌套：我们可以先做一个一行两列的利用表格的嵌套：我们可以先做一个一行两列的表格，然后在这个表格的每个单元格里在插入一表格，然后在这个表格的每个单元格里在插入一个表格就行了。个表格就行了。n 利用表格自身属性：连续插入两个表格