使用多个 <tbody> 对表格内容进行分组 - 在线编辑器

<style>
table {
  border: 2px solid #555;
  border-collapse: collapse;
  font: 16px "Lucida Grande", "Helvetica", "Arial", sans-serif;
}

th, td {
  border: 1px solid #bbb;
  padding: 2px 8px 0;
  text-align: left;
}

thead > tr > th {
  background-color: #cce;
  font-size: 18px;
  border-bottom: 2px solid #999;
}
</style>

<table>
  <thead>
    <tr>
      <th>学生编号</th>
      <th>姓名</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th colspan="2">计算机科学</th>
    </tr>
    <tr>
      <td>3741255</td>
      <td>琼斯，玛莎</td>
    </tr>
    <tr>
      <td>4077830</td>
      <td>皮尔斯，本杰明</td>
    </tr>
    <tr>
      <td>5151701</td>
      <td>柯克，詹姆斯</td>
    </tr>
  </tbody>
  <tbody>
    <tr>
      <th colspan="2">俄罗斯文学</th>
    </tr>
    <tr>
      <td>3971244</td>
      <td>尼姆，维克多</td>
    </tr>
  </tbody>
  <tbody>
    <tr>
      <th colspan="2">天体物理学</th>
    </tr>
    <tr>
      <td>4100332</td>
      <td>彼得罗夫，亚历山德拉</td>
    </tr>
    <tr>
      <td>8892377</td>
      <td>丰田裕子</td>
    </tr>
  </tbody>
</table>
​x
 
<style>
table {
  border: 2px solid #555;
  border-collapse: collapse;
  font: 16px "Lucida Grande", "Helvetica", "Arial", sans-serif;
}
​
th, td {
  border: 1px solid #bbb;
  padding: 2px 8px 0;
  text-align: left;
}
​
thead > tr > th {
  background-color: #cce;
  font-size: 18px;
  border-bottom: 2px solid #999;
}
</style>
​
<table>
  <thead>
    <tr>
      <th>学生编号</th>