第六章 设计表格精要.ppt

第六章 设计表格 6.1 表格的基本元素 在html文档中，表格是通过table,th,tr,td标签来完成的，如下表所示： 在一个最基本的表格中，必须包含一组table标签，一组标签tr和一组td标签或th。 看[例6.1]文本文件 6.2 TABLE标签的参数 6.2.1外框线参数 格式 ： TABLE BORDER=N N=0，1，2…… 说明：N取值0时表示没有外框线。 看[例6.2]文本文件 6.2.2单元格边框线粗细参数CELLSPACING 格式 ： TABLE BORDER=N CELLSPACING=N N=0，1，2…… 看[例6.3]文本文件 6.2 TABLE标签的参数 6.2.3单元格间距参数CELLPADDING 格式 ： TABLE BORDER=N CELLPADDING=N N=0，1，2…… 说明：这个参数必须同BORDER 配合使用，设置单元格文字到边框的距离。 看[例6.4]文本文件 6.2.4表格排列参数ALIGN 格式 ： TABLE ALIGN =选择项 选择项取值：LEFT，CENTER，RIGHT。 说明：将表格设置在页面的左边、居中或右边。 看[例6.5]文本文件 6.2 TABLE标签的参数 6.2.5 表格长和高的参数WIDTH、HEIGHT 6.2.5.1 绝对值 格式 ： TABLE WIDTH =N1 HEIGHT =N2 N1、N2：取自然数。 说明：这两个参数不一定要同时设定。 看[例6.6]文本文件 通过以下例题比较WIDTH 与 CELLPADDING作用下的区别。 看[例6.7]文本文件 6.2 TABLE标签的参数 6.2.5.2 相对值 格式 ： TABLE WIDTH =N1 N1取值：百分数。 说明：使用相对值可以使表格随着窗口大小的改变而改变。注意：表格的高度没有相对值。 看[例6.8]文本文件 6.2.6 表格的背景颜色( TABLE BORDERCOLOR =N N的取值;外框颜色设置) 格式 ： TABLE BGCOLOR =N N的取值： 1）用“#”加6位十六进制数，如：#FF0000是红色，00FF00是绿色等。 2）用英文表示，如：RED，GREEN 等。 看[例6.9]文本文件 6.3 表格的标题 6.3.1 CAPTION 格式 ： CAPTION / CAPTION 说明：标签内的文字定义为表格标题，处于表格之外。 看[例6.10]文本文件 6.3.2标题位置 HTML语言提供标题的排列有位于表格的左右和上下之分。 6.3.2.1左右排列ALIGN 格式 ： CAPTION ALIGN =选择项 选择项为：LEFT、CENTER、RIGHT。 说明：选择项所定义的左、中、右都是对应于表格的位置。 看[例6.11]文本文件 6.3 表格的标题 6.3.2.2上下排列VALIGN 格式 ： CAPTION VALIGN =选择项 选择项为：TOP、BOTTOM。 说明：选择项所定义的上、下位置都是紧贴表格的。 看[例6.12]文本文件 6.4 单元格 单元格主要由TH,TR,TD标签控制。他们的各种参数设置可以改变单元格的格式。 6.4.1颜色参数BGCOLOR 格式 ： TR BGCOLOR =N ……/TR TH BGCOLOR =N ……/TH TD BGCOLOR =N ……/TD 说明：N的取值与表格背景颜色取值相同。 看[例6.13]文本文件 6.4 单元格 6.4.2 单元格间距参数 本节的参数与表格的长度和高度的同名参数大体相同，只是影响的对象是单元格。 6.4.2.1 列间距参数WIDTH 格式 ： TH WIDTH =N ……/THN取值：自然数 TD WIDTH =N ……/TD N取值：自然数 说明：列间距即指单元格的长度。如果没有WIDTH参数，长度由该单元格所在列的全部单元格中内容最长的长度决定。设置某一个单元格WIDTH的取值后，会影响其所在列的长度。 看[例6.14]文本文件 6.4 单元格 6.4.2.2 行间距参数HEIGHT 格式 ： TH HEIGHT =N ……/THN取值：自然数 TD HEIGHT =N ……/TD N取值：自然数 说明：行间距参数与列间距功能基本相同，它改变单元格的高度。 看[例6.15]文本文件 6.4 单元格 6.4.3 单元格对齐方式 标题单元格中的内容自动采取居中的方式，其余单元格也可以进行排列。 6.4.3.1 左右排列ALIGN 格式 ： TR ALIGN =N ……/TRN取值：LEFT，CENTER，RIGHT TH ALIGN =N ……/THN取值：LEFT，CE