商务网页第9课.ppt

3．统一设置列的宽度与行的高度 因显示的数据内容不同，有的列需要宽一些，有的列需要窄一些；有的行需要高一些，有的行需要矮一些。HTML可以统一设置某列的宽度与某行高度的方法，不必逐个单元格去设置。 （1）统一设置列的宽度 HTML中没有表格列的标签，统一设置列的宽度实际上是按照“某列最宽原则显示”的规律来设置的，统一设置列宽的关键在于设置首行各个表头（或单元格）的宽度。首行的表头或单元格的宽度设置好了，其下边各个单元格（或表头）的宽度无须再设置，系统会认为这些单元格的宽度小于首行表头或单元格的宽度，自动跟随首行单元格或表头的宽度，客观上形成了一列统一宽度的单元格，完成了统一设置列的宽度的任务。 统一设置列的宽度，需要使用表头标签th（不设表头的，正常使用单元格标签td）及其“width”属性。设置方法为 th width=属性值 其中，列宽的属性值与表格宽度的属性值一样，有绝对像素值、百分比两种表达形式。当表头使用百分比的形式时，各个表头的百分比之和不应当超过100%，否则会出现显示异常。 （2）统一设置行的高度 统一设置某行的高度有两种方法： 一种是方式与统一设置某列的宽度类似，按照某行最高原则显示的特点进行设置。如果某行内各个单元格的高度不一致，系统会根据该行高度最高的单元格的高度补齐显示。关键在于设置好表格最左边那列的各个单元格或表头的高度； 第2种方法是使用行标签tr来实现。 第1种方法与统一设置某列宽度的方法相似，不再做介绍。下面我们来介绍采用行标签tr设置某行高度的方法。 利用行标签设置行的高度，需要使用标签tr及其“height”属性。设置方法为 tr height=属性值 height的属性值同样有绝对像素值、百分比两种形式。 html head title统一设置行的高度/title /head body table height=90% border=1 tr height=10% th width=50表头1/th th width=50表头2/th th width=80表头2/th /tr tr height=30% tdnbsp;/td tdnbsp;/td tdnbsp;/td /tr tr height=50% tdnbsp;/td tdnbsp;/td tdnbsp;/td /tr /table /body /html 4．统一设置行的对齐方式 表格内容的对齐方式通常按照行来统一设置，以提高网页的制作效率。 （1）统一设置行的水平对齐方式 统一设置某行单元格的对齐方法，可以采用行标签tr的“align”属性。设置方法为 tr align=属性值 其中，标签tr的“align”属性值与表头、单元格的“align”属性值相同，默认值为“left”。 html head title设置整行单元格水平对齐/title /head body table width=235 border=1 caption 商务网页设计与制作成绩表 /caption tr th序号/th th姓名/th th成绩/th /tr tr align=center td1/td td张一丰/td td99/td /tr tr align=right td2/td td王二小/td td95/td /tr tr td3/td td田莉/td td93/td /tr tr td4/td td李树青/td td83/td /tr tr td5/td td高文军/td td82/td /tr /table tr/tr /body /html （2）统一设置行的垂直对齐方式 统一设置某行单元格的垂直对齐方式需要使用行标签tr的“valign”属性，设置方法为 tr valign=属性值 其中，标签tr的“valign”属性值与单元格标签的属性值相同，默认值为“middle”。 tr height=80 td3/td td田莉/td td93/td /tr tr td4/td td李树青/td td83/td /tr tr td5/td td高文军/td td82/td /tr /table tr/tr /body /ht