在元素中添加元素

Question

我有一个html表，其中一个标题超过2列。如何为2列中的每一列添加子标题？

例如在附图中，我希望“联系人”列包含相应列的子标题“电话”和“地址”。

Answer 1

就像你在纸上画出桌子一样：

<table>
  <thead>
    <tr>
      <th rowspan="2">Name</th>
      <th rowspan="2">Email</th>
      <th colspan="2">Contact</th>
    </tr>
    <tr>
      <th>Phone</th>
      <th>Address</th>
    </tr>
  </thead>
  <tbody>
    <!-- your data goes here -->
  </tbody>
</table>

Answer 2

您需要有两个单独的标题行：

<tr>
  <th rowspan="2">Name</th>
  <th rowspan="2">Email</th>
  <th colspan="2">Contact</th>
</tr>
<tr>
  <th>Number</th>
  <th>Address</th>
</tr>

Answer 3

添加另一行并将子标题放在<td />标记中。也许给行一个类并设置td文本的样式？这样他们看起来与真正的标题看起来不一样，这可能会引起混淆。

Answer 4

<table>
<tr>
<th>Title 1</th><th>Title 2</th><th colspan="2">Title 3</th>
</tr>
<tr>
<td>content</td><td>content</td><th>subtitle 1</th><th>subtitle 2</th>
</tr>
<tr>
<td>content</td><td>content</td><td>content</td><td>content</td>
</tr>
</table>