HTML学习笔记——使用表格

5.1 创建表格
5.1.1表格的基本构成table、tr、td
表格由行、列和单元格3部分组成，一般通过3个标记来创建，分别是表格标记table、行标记tr、列标记td。表格的各种属性都要在表格的开始标记< table>和表格的结束标记< /table>之间才有效。
行：表格中的水平间隔。
列：表格中的垂直间隔。
单元格：表格中行与列相交所产生的区域。
语法：

<table>
  <tr>
      <td>单元格内的文字</td>
  <td>单元格内的文字</td>
</tr>
<tr>
    <td>单元格内的文字</td>
<td>单元格内的文字</td>
</tr>
</table>

5.1.2 设置表格的标题caption
可以使用< caption>来设置标题单元格，表格的标题一般位于整个表格的第一行。一个< table>表格只能含有一个表格标题。
语法：< caption>表格的标题< /caption>
5.1.3 表头th
表格的表头< th>是< td>单元格的一种变体，实质上仍是一种单元格。它一般位于第一行和第一列，用来表明这一行或列的内容类别。在一般情况下，浏览器会以粗体和居中的样式显示< th>元素中的内容。
语法：

<table>
  <tr>
  <th>80</th>
......
<tr>
      <td>单元格内的文字</td>
<td>单元格内的文字</td>
</tr>
</table>

5.2表格基本属性
5.2.1 表格宽度width和高度height
宽度和高度的值可以是像素值也可以是百分比。
语法：

<table width=”宽度” height=”高度”>

5.2.2 表格对齐方式align
语法：<table align=”对齐方式”>
5.3 表格的边框
5.3.1 表格边框宽度border
默认情况下如果不指定border属性，则浏览器将不显示表格边框。只有设置border值不为0，在网页中才能显示出表格的边框。
语法：<table border=”边框宽度”>
5.3.2 表格边框颜色bordercolor
默认情况下边框的颜色是灰色的，可以使用bordercolor设置边框颜色。但是设置边框颜色的前提是边框的宽度不能为0，否则无法显示出边框的颜色。
语法：<table border=”边框宽度” bordercolor=”边框颜色”>
5.3.3 内框宽度cellspacing
表格的内框宽度属性cellspacing用于设置表格内部每个单元格之间的间距。单位是像素。
语法：<table cellspacing=”内框宽度值”>
5.3.4 表格内文字与边框间距cellpadding
在默认情况下，单元格里的内容会紧贴着表格的边框，这样看上去非常拥挤。可以使用cellpadding来设置单元格边框与单元格里的内容之间的距离。单位是像素。
语法：<table cellpadding=”文字与边框距离值”>
5.4 表格背景
5.4.1 表格背景颜色bgcolor
表格的背景颜色属性bgcolor是针对整个表格的，bgcolor定义的颜色可以被行、列或单元格定义的颜色所覆盖。
语法：<table bgcolor=”背景颜色”>
5.4.2 表格背景图像
语法：<table background=”背景图像地址”>
5.5 表格的行属性
高度控制height、边框颜色bordercolor、行背景bgcolor、background、行文字的水平对齐方式align、行文字的垂直对齐方式valign。
语法：<tr height=”行的高度” bordercolor=”边框的颜色” bgcolor=”行的背景颜色” align=”水平对齐方式” valign=”垂直对齐方式”>
5.6 单元格属性
5.6.1 单元格大小width、height
语法：<td width=”单元格宽度” height=”单元格高度”>
5.6.2 水平跨度colspan，垂直跨度rowspan
在设计表格时，有时需要将两个或者更多的相邻单元格组合成一个单元格。
语法：<td colspan=”跨度的列数” rowspan=”跨度的行数”>
5.6.3 对齐方式align、valign
语法：<td align=”水平对齐方式” valign=”垂直对齐方式”>
5.6.4 单元格的背景色，边框颜色bordercolor
语法：<td bgcolor=”背景颜色” bordercolor=”边框颜色”>
5.6.5 单元格的亮边框bordercolorlight和暗边框bordercolordark和背景图像background
语法：<td bordercolorlight=”亮边框的颜色” bordercolordark=”暗边框的颜色” background=”背景图像的地址”>
5.7表格的结构
表格的表首标记< thead>、表主体标记< tbody>、表尾标记 < tfoot>。这三个语法相似。
语法：

<thead bgcolor=”背景颜色” align=”对齐方式”>
  ......
  </thead>