HTML- table表格的使用，常见表格标签的使用汇总，表格合并规则，跨行合并与跨列合并

以前表格主要是用来布局、显示数据，随着技术的更新迭代表格布局逐渐被淘汰，现多用于展示数据

表格通过 table 标签来定义，一个完整的表格包含表格的 caption（标题）、tr（行）、td（列）、thead（表头）、th（表头单元格）、tbody（主体内容）、tfoot（表格页脚）

各个标签的作用

• table 用于定义表格
• caption 定义表格的标题，属于表格的一部分，写在表格标签的内部，使用该标签时必须放在 table 标签的第一个子标签位置（紧随 table 标签），标题中的内容默认在表格中居中显示
• thead 用于定义表格中的表头部分
• th 写在表头的内部，用来定义表头单元格，主要通过数据的性质进行数据分类，写在该标签中的内容默认会加粗、居中
• tbody 表格的主体部分，用来包裹 tr、td 标签，该标签未设置时浏览器会默认创建
• tr 定义表格的行，一个表格可以有多行，每行可以有多列，只有定义了行才能定义列
• td 表格单元格，用来定义列，数据就是放在该标签中，数据默认左对齐
• tfoot 定义表格的页脚，一般放在表格的底部

表格基本结构、默认效果

 <table>
   <!-- 定义表格的标题 -->
   <caption>表格标题</caption>
   <!-- 表格的表头 -->
   <thead>
     <tr>
       <!-- 表头单元格 -->
       <th>姓名</th>
       <th>性别</th>
       <th>年龄</th>
     </tr>
   </thead>

   <!-- 表格主体部分 -->
   <tbody>
     <tr>
       <td>小小</td>
       <td>girl</td>
       <td>119</td>
     </tr>
   </tbody>

   <!-- 表格的页脚 -->
   <tfoot>
     <tr>
       <td>页脚</td>
       <td>页脚</td>
       <td>页脚</td>
     </tr>
   </tfoot>
 </table>

各个标签常见的属性（控制样式的属性一般使用 CSS 来设置）

<table></table> 标签

• width 设置表格的宽度
• height 设置表格的高（一般不设置）
• border 设置表格的边框，不包含表格的标题部分
• align 整个表格在网页中的对齐方式；left（左对齐）、center（居中对齐）、right（右对齐）
• cellpadding 用于设置单元格中的内容与单元格边沿的距离（四周）
• cellspacing 设置单元格之间的距离（四周）
• rules 设置表格的单元格边框是否可见；none （不可见）、all（显示行列之间的线条，非行列之间的线条不显示）、rows（显示行与行之间的边框）、cols（显示列于列之间的线条）
• bgcolor 设置整个表格的背景色（不包含表哥格标题部分）

设置了 width、border、align 后效果

<table width="500" border="1" align="center">