050表格.ppt

7.3.2 设置表格的边框属性——border 基本语法 table border= bordercolor＝”” tr td/td /tr /table 语法说明 ? border属性用于设置边框的粗细； ? bordercolor设置表格边框的颜色。 7.3.2 设置表格的边框属性——border 实例代码 使用 CSS 来添加边框样式 7.3.4 设置表格的背景——bgcolor 基本语法 table bgcolor=”” tr td/td /tr /table 语法说明 在HTML文件中，通过设置bgcolor的属性值就可以设置表格的颜色。 7.3.4 设置表格的背景——bgcolor 实例代码 h4背景颜色：/h4 table border=1 bgcolor=red tr tdFirst/td tdRow/td /tr tr tdSecond/td tdRow/td /tr /table First Row Second Row 背景颜色： 7.3.4 设置表格的背景图片—background 实例代码 h4背景图像：/h4 table border=1 background=“images/bg1.gif tr tdFirst/td tdRow/td /tr tr tdSecond/td tdRow/td /tr /table 7.4 设置表格行与单元格 7.4.1 调整行内容水平对齐——align 7.4.2 调整行内容垂直对齐——valign 7.4.3 设置跨行——rowspan 7.4.4 设置跨列——colspan 7.4.5 设置单元格间距——cellspacing 7.4.6 设置单元格边距——cellpadding 7.4.1 调整行内容水平对齐——align 基本语法 table tr align=”” /tr tr td/td /tr /table 语法说明 在HTML文件中，设置行内容水平对齐方式常用的有： ? Left设置内容左对齐； ? Right设置内容右对齐 ? Center设置内容居中对齐。 BODY TABLE border=2 align=center CAPTION align=top学员档案信息/CAPTION TR TH姓名/TH TH align=center性别/TH TH align=right分数/TH /TR TR TDRobert/TD TD align=centerM/TD TD align=right80/TD /TR ....... /TABLE /BODY /HTML 表格的对齐方式 整个表格居中 姓名列默认左对齐 性别列居中 分数列右对齐 HTML/CSS/JavaScript 标准教程实例版（第3版） 第 章 7 * * * 强调表格的几个重要组成部分： 1）行 2）列 3）单元格 4）列标题（一般位于第一行或第一列，粗体显示），可选 5）表格标题，可选 * 1.先根据效果图：集体提问，表格是多少行多少列？ 回答：肯定是2行3列。 2.讲解代码：TABLE表示….TR表示…TD表示。 3. 4.演示：TG5-Source文件为了代码的可读性，象C语言写代码一样，为了显示层次关系， 建议学员写HTML代码时保持一定的缩进，如幻灯片的示例代码所示。 夹中的“简单表格”用例。 * 讲解要点： 1）表格一般都需要标题，说明表格的内容主题。表格的标题由标签CAPTION设置 设置标题位于表格上方： 　　CAPTION align=top 表格标题 /CAPTION 设置标题位于表格下方： 　　CAPTION align=bottom表格标题/CAPTION 2）同理，表格的第一行或第一列，一般需要加粗突出显示，作为行或列的标题。 设置行或列的标题： TH行或列标题/TH 演示：TG5-Source文件夹中的“表格标题”用例。 * 讲解要点： 1）为了美观大方，表格中的数据一般需要设置对齐方式。 2）设置表格、行或列的对齐方式，修改align属性为right（右对齐），center（居中）或left（左对齐）就可以了，默认为“左对齐”。 本例效果：设置表格居中显示，姓名列“左对齐”，性别列居中，分数列“右对齐”。 演示：TG5-Source文件夹中的“表格对齐”用例。 * 第五课 表格 第4章 表格的应用 7.1 表格概述 7.2 插