表格行与列的合并实例

表格：行与列的合并

1.表格实例

    <table border="1">
      <!-- 标题caption -->
      <caption>
        个人信息表
      </caption>
      <!-- 表头thead -->
      <thead>
        <tr>
          <th>班级</th>
          <th>姓名</th>
          <th>学号</th>
          <th>身份证</th>
          <th>学费</th>
        </tr>
      </thead>
      <!-- 内容tbody -->
      <tbody>
        <tr>
          <th rowspan="3">网络安全1班</th>
          <td>许向荣</td>
          <td>20105330639</td>
          <td>330322200201300016</td>
          <td>4200</td>
        </tr>
        <tr>
          <td>牛牛哥</td>
          <td>20105330640</td>
          <td>330322200201300016</td>
          <td>2000</td>
        </tr>
        <tr>
          <td>韩金鳞</td>
          <td>20105330641</td>
          <td>330322200201300016</td>
          <td>3000</td>
        </tr>
        <tr>
          <th>信息安全1班</th>
          <td>金一里</td>
          <td>20105330642</td>
          <td>330322200201300016</td>
          <td>2000</td>
        </tr>
        <tr>
          <th>信息安全1班</th>
          <td>杨超越</td>
          <td>20105330642</td>
          <td>330322200201300016</td>
          <td>3000</td>
        </tr>
      </tbody>
      <tfoot>
        <th colspan="4">学费总计：</th>
        <th>14200</th>
      </tfoot>
    </table>

---

知识要点总结

1. 合并属性：rowspan(行合并)和colspan(列合并)必须写到th或者td中

2. th和td都是单元格，th有预制样式：加粗和居中

3. caption标签是标题的意思