ch4HTML表格.pptVIP

学习目标 掌握表格的基本结构 掌握表格边框、标题的用法 掌握表格行、单元格的控制 掌握表格嵌套、文字环绕功能的用法 HTML表格概述 表格是一些数字和文字的组合，这些数字和文字按行和列的方式放置在表格的单元格（cell）中，表格由一定数目的行和列组成，其中第一行往往放置那些具有描述功能的表头信息。 表格包括表头、数据项等元素，每一个元素都可以有自己特有的修饰标签。在编写表格时，一般按照从上到下、从左到右的顺序，为表格的每一列定义表头和数据，然后一行接一行地写下去。 表格的单元格中可以放入各式各样的Web资源，包括图像、分隔线、表单、甚至是另一个表格。 表格结构－1 表格的创建一般是通过table、tr、th、td四个标签完成。 表格起始标签table与/table：table标签用于标识一个表格组件，表格是由多个横行(tr)、标题单元格（th）与单元格(td)组成的。 表格行标签tr与/tr：tr标签用于定义表格的一行，在tr标签可以包含多个标题单元格（th）与单元格(td) 。 标题单元格标签th与/th：th标签用于定义表格内的标题单元格，此单元格中的文字将以粗体的方式显示。当然在表格中，也可以不使用th标签，直接用普通单元格(td)来取代标题单元格（th）。 单元格标签td与/td：td标签用于定义表格的单元格，一个td标签将创建一个单元格。td标签必须放入tr标签内。 表格结构－2 table tr th/th th/th … … tr tr td/td td/td … … tr … … /table 表格边框 通过border属性设置表格边框的宽度，其语法如下： table border=数值 通过cellspacing属性设置表格中相邻单元格的间距以及单元格外边沿与表格边沿之间的间距，其语法如下： table cellspacing=数值 通过cellpadding属性设置单元格的边沿和它的内容之间的距离，它的默认值是一个像素，其语法如下： table cellpadding=数值 表格标题 表格标题是通过caption标签来创建的。 通常在table标签后立即加入caption标签及其内容，即caption标签是table内出现的第一个标签。 利用caption标签的align属性来控制表格标题文字的位置，其语法如下： caption align= top 或 bottom 当align的值为top时，标题将位于表格的上方；当align的值为bottom时，标题将位于表格的下方。 表格的控制 通过table标签的“height”属性来设置整个表格的高度，其语法如下： table height=高度 通过table标签的“width”属性来设置整个表格的宽度，其语法如下： table width =宽度 通过table标签的“bordercolor”属性来设置表格边框的颜色，其语法如下： table bordercolor =颜色值 通过table标签的“bgcolor”属性来设置表格的背景颜色，其语法如下： table bgcolor =颜色值 通过table标签的“align”属性来设置整个表格的水平对齐方式，其语法如下：table align =left（左对齐）或center（居中对齐）或right（右对齐） 表格行的控制 通过tr标签的“height”属性来设置表格内某行的高度，其语法如下： tr height=高度 通过tr标签的“bordercolor”属性来设置表格某行的边框颜色，其语法如下： tr bordercolor =颜色值 通过tr标签的“bgcolor”属性来设置表格某行的背景颜色，其语法如下： tr bgcolor =颜色值 通过 tr标签的“align”属性来设置表格某行的单元格内文字的水平对齐方式，其语法如下： tr align =left（左对齐）或center（居中对齐）或right（右对齐） 通过 tr标签的“valign”属性来设置表格某行的单元格内文字的垂直对齐方式，其语法如下： tr valign =“top（上对齐）或middle(居中对齐)或bottom（下对齐） 单元格的控制 通过th或td标签的“width”属性来设置单元格的宽度： th width=宽度 td width=宽度 通过th或td标签的“bordercolor”属性来设置单元格的边框颜色： th bordercolor =颜色值 td bordercolor =颜色值 通过th或td标签的“bgcolor