html body随table增大,应用开发与实践第4章Web页面制作基础课案.ppt

应用开发与实践第4章Web页面制作基础课案.ppt

保存文件为index.htm。在IE浏览器中打开该文件，运行结果如图4-19所示。 图4-19 定义表格表头 4.5.3 设置表格的边框和间隔 标记的border属性用于设置表格的边框大小，cellspacing属性和cellpadding属性用于设置表格内元素的间隔。 border属性 定义表格边框线的宽度，单位为像素。默认情况下，表格的边框为0像素。 cellspacing属性 设定表格的单元格与单元格之间的间距。间距以像素为单位。 cellpadding属性 设定表格的单元格内容和边框之间的距离。边距以像素为单位。 【例4-17】设置表格的边框和间隔 通过标记的border属性设置边框为5像素，cellspacing属性设置间距为8像素，cellpadding属性设置边距为10像素，代码如下：

第一行第一列	第一行第二列
第二行第一列	第二行第二列

保存文件为index.htm。在IE浏览器中打开该文件，运行结果如图4-20所示。 图4-20 设置表格的边框和间隔 4.5.4 定义表格尺寸和背景颜色 定义表格尺寸 通过标记的width和height属性可以设置整个表格的宽度和高度；通过标记的width和height属性可以设置表格内单元格的宽度和高度。单位为像素或者以百分比形式表现。 【例4-18】定义表格尺寸 设定表格的宽度为300像素，并设置第一列单元格的相对宽度为30%，单元格的高度为20像素，代码如下：

******	******
******	******

保存文件为index.htm。在IE浏览器中打开该文件，运行结果如图4-21所示。 图4-21 定义表格尺寸 设置表格背景颜色 通过标记的bgcolor属性可以设置整个表格的背景颜色，通过标记的bgcolor属性可以设置表格同一行的背景颜色，通过标记的bgcolor属性可以设置一个单元格的背景颜色。 【例4-19】设置表格背景颜色(实例位置：光盘\MR\源码\第4章\4-19) 通过标记、标记和标记的bgcolor属性分别设置整个表格、表格的一行、单元格的背景颜色，代码如下：

第一行第一列	第一行第二列
第二行第一列	第二行第二列
第三行第一列	第三行第二列

以上代码中设置整个表格的背景颜色为橘黄色，可参见“第一行第一列”、“第一行第二列”、“第二行第一列”；设置“第二行第二列”的背景颜色为白色；设置第三行的背景颜色为浅灰色。保存文件为index.htm。在IE浏览器中打开该文件，运行结果如图4-22所示。 图4-22 设置表格背景颜色 4.5.5 设定表格的对齐方式 通过标记的align属性可以设定表格相对于页面的水平对齐方式，通过标记的align属性、valign属性可以设定一行内容的水平和垂直对齐方式，通过标记的align属性、valign属性可以设定单元格内容的水平和垂直对齐方式。 【例4-20】设定表格的对齐方式(实例位置：光盘\MR\源码\第4章\4-20) 通过标记的align属性定义整个表格居右对齐，通过标记和