笔记 - 2、HTML - 表格

HTML·表格：用<table>标记声明一个表格（***）

<tr>标记：表示表格的行，嵌套在<table></table>中。

<td></td>:表示表格的单元格,嵌套在<tr></tr>中。

<caption></caption>：表格的标题，写在表格的内部，与<tr></tr>同级。

table的属性：

    border:表示表格的边框

    width:表示表格的宽度，可用像素值表示，也可用百分比来表示。

    height:表示表格的高度。只能以像素值表示，不能以百分比表示。

    align：表格的对齐方式left，center，right，默认是left。

    bordercolor：表示表格边框的颜色，只表示整个表格外边框的颜色。

    cellspacing：表示单元格与单元格之间的距离

    cellpadding：单元格中的内容与单元格边框的距离。

    bgcolor：表格的背景颜色。

    background：整个表格的背景图片。

tr的属性：

    height：设置当前行的高度，如果是你设置的高度比单元格中的内容的高度还要小的话，浏览器默认是内容有多高，这行就有多高。

    bordercolor：当前行单元格的边框颜色。只对一行起作用。

    bgcolor：表示当前行的背景颜色。会覆盖掉在table中设置的背景颜色。

    background：表示背景图片，但是现在的浏览器不支持该属性。

    align：当前行的每个单元格的水平对齐方式，left(默认),center,right

    valign：当前行的每个单元格的垂直对齐方式，top（顶部），middle（中间，默认的），bottom（底部）

td的属性：

    align：单元格中的内容的对齐方式left，center，right，默认是left。

    valign：当前单元格的垂直对齐方式，top（顶部），middle（中间，默认的），bottom（底部）

    colspan：（****）

        合并单元格，横向合并，注意：合并后要将被合并的单元格删除。

    rowspan：（****）

        合并单元格，纵向合并，注意：同上↑。

    bordercolor：表示当前单元格的边框颜色，只对一个单元格起作用。

    width：表示当前单元格所在的列的所有单元格的宽度。

    height：表示当前单元格所在行的所有单元格的高度。

    bgcolor：表示当前单元格的背景颜色。会覆盖在tr或table中设置的背景颜色。

    background：表示当前单元格的背景图片。会覆盖掉在table中设置的背景图片。

    bordercolorlight：表示单元格的亮边框颜色（单元格右边框和下边框的颜色）。

    bordercolordark：表示单元格暗边框的颜色（单元格左边框和上边框的颜色）。

<th></th>:（**）

    通常用来写在表格的首行，作为表头。

    与<td>一样，<td>有什么属性，<th>就有什么属性，写在<tr></tr>中，表示一个单元格，但是<th>有默认的样式，字体加粗，文本居中。

总结表格共有属性：height，align，bordercolor，background。。。

表格的结构：（**）

    用三对标签来实现表格的结构：<thead></thead>，<tbody></tbody>,<tfoot></tfoot>

    其中在一个表格中<tbody></tbody>可以有多个，thead和tfoot只有一个。（*）