# 表格（table）

### 表格简介

html的table元素表示表格数据  ——即通过二维数据表表示的信息

### 简单的表格

```
<table>									<!-- table 声明是一个表格 -->
  <tr>									<!-- tr 声明一行 -->
    <td>第一行第一列格中的内容</td>		 <!--td 声明一列 -->
  </tr>
</table>
```

效果如下：

![image-20201217144534429](表格.assets/image-20201217144534429.png)



### 表格（table） 的相关标签

| table   | 声明是个表格       |
| ------- | ------------------ |
| tr      | 声明一行           |
| td      | 声明一列           |
| caption | 声明表格标题       |
| th      | 声明表格表头单元格 |
| thead   | 表格头部           |
| tbody   | 表格主体           |
| tfoot   | 表格结尾           |

> thead, tbody, tfoot 没有实际效果  只是响应 html5的语义化标签



### 表格 合并单元格

table 通过colspan 属性实现横向合并

​		  通过rowspan 属性实现纵向合并

> colspan和rowspan 的属性值都是数字
>
> 如： colspan="3"
>
> ​		rowspan="4"

效果如下：

![image-20201217150855004](表格.assets/image-20201217150855004.png)

​