20101120-第8章-使用表格.ppt

网 页 设 计 与 欣赏 一、创建表格 （一）创建一个普通表格应包括的标记标记 1.TABLE / TABLE :定义整个表格，表格的所有内容都位于该标记内。 2 .CAPTION /CAPTION :定义表格标题，其常用属性是align，取值如下： 　　　　　　　　　　　　　1）top：在表格上部（默认值） 　　　　　　　　　　　　　2）bottom：在表格下部 　　　　　　　　　　　　　3）left：在表格上部的左侧 　　　　　　　　　　　　　4）right：在表格上部的右侧 3.TR /TR ：定义表格中的行，且一对TR /TR 只能定义一行 4 .TH /TH ：定义表格中的表头单元格 5 .TD /TD ：定义每行中的各个单元格， 行中有多少个单元格，就有多少个TD （二）合并单元格 1.行合并：在TD 或TH内使用rowspan属性（跨越的行数） 2.列合并：在TD 或TH内使用colspan属性（跨越的列数） （三）创建表格的步骤 1.先使用TABLE ，若需要标题，则在TABLE 后使用CAPTION ； 2.使用TR 画第一行； 3.使用TD 或TH定义该行上的各列单元格； 　（1）若碰到跨行的单元格，则用rowspan属性，且在首次出现的行中使用rowspan 　 （2）若碰到跨列的单元格，则用colspan进行合并 4.重复步骤2－3，依次画出每一行，直到表格结束。 table标签的属性有： width（宽度） height（高度） bgcolor（背景颜色） background（表格背景图片） border（边框宽度） bordercolor（边框颜色） bordercolorlight（边框明亮部分颜色） bordercolordark （边框昏暗部分颜色） cellspacing（单元格边距） cellpadding（单元格填充距） align（对齐方式） TR标签的属性有： align(水平对齐方式） valign（垂直对齐方式） bgcolor（行背景颜色） bordercolor（边框颜色） bordercolorlight（边框明亮部分颜色） bordercolordark（边框昏暗部分颜色） TD标签的属性有： Align（水平对齐方式） valign（垂直对齐方式） width（宽度） height（高度） bgcolor（单元格背景色） colspan（跨占的列数，缺省值为1) rowspan（跨占的行数，缺省值为1） 二、表格的对齐 1.表格在页面中的对齐： （1）直接在TABLE 中使用align属性 （2）将TABLE 放在DIV　align=“ ”与/DIV之间 2.表格内容的水平对齐： 　在TR 、 TH 、 TD内使用 align属性 3.表格内容的垂直对齐：在TR 、 TH 、 TD内使用 valign属性（取值为top/middle\bottom） 三、使用表格设计网页布局 （一）控制表格和单元格大小 使用width和height属性来定义表格或单元格大小，其取值可以是象素或百分比。 例： html head meta http-equiv=Content-Type content=text/html; charset=gb2312 / title控制表格和单元格大小/title /head body table border aligh=center tr height=400 td width=200nbsp; td width=300nbsp; td width=200nbsp; tr td colspan=3 height=100nbsp; /table /body /html 第3章　文字与段落 （二）设置表格及单元格的背景 可以在TABLE、 TR 、 TH 、 TD等标记内使用bgcolor或background属性来定义背景色或背景图片。 （三）使用嵌套表格 在给页面布局时，非常有效的一种方法就是将表格嵌套。 只要将表格作为一个单元格的内容，放在TD 与/TD之间即可。 例： html head meta http-equiv=Content-Type content=text/html; charset=gb2312 / title使用嵌套表格/title /head body table align=center cellspacing=0 cellpadding=0 widt