HTML 表格
HTML 表格
[toc]
# 让我们一起来学习HTML表格吧
表格是由 <table> 标签来定义，每个表格的行由 <tr> 标签定义，每行被分割为若干单元格由 <td> 标签定义。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。
HTML 表格标签
| 表格 | 描述 |
| <table> (opens new window) | 定义表格 |
| <caption> (opens new window) | 定义表格标题 |
| <th> (opens new window) | 定义表格的表头 |
| <tr> (opens new window) | 定义表格的行 |
| <td> (opens new window) | 定义表格单元的列 |
| <thead> (opens new window) | 定义表格的页眉 |
| <tbody> (opens new window) | 定义表格的主体 |
| <tfoot> (opens new window) | 定义表格的页脚 |
| <col> (opens new window) | 定义用于表格列的属性 |
| <colgroup> (opens new window) | 定义表格列的组 |
# 实例
<body> <table border="1"> <caption>个人信息</caption> <tr> <td>ID</td> <td>姓名</td> <td>年龄</td> <td>分数</td> </tr> <tr> <td>1</td> <td>张三</td> <td>18</td> <td>90</td> </tr> <tr> <td>2</td> <td>李四</td> <td>20</td> <td>88</td> </tr> </table> </body>
结果：
# 表格中的边框属性
如果不定义边框属性，表格将不显示边框
<table border="1"></table>
# 表格合并
colspan列合并
# 实例
<table border="1"> <tr> <th>姓名</th> <th colspan="2">电话</th> </tr> <tr> <td>张三</td> <td>111122233</td> <td>444556677</td> </tr> </table>
- 结果：
rowspan行合并
# 实例
<table border="1"> <tr> <th>姓名</th> <td>Bill Gates</td> </tr> <tr> <th rowspan="2">电话</th> <td>111112223</td> </tr> <tr> <td>444445566</td> </tr> </table>
- 结果：