Добавление элемента <th> в элементе <th>

Question

У меня есть таблица html с одним из заголовков, охватывающих более двух столбцов. Как я могу добавить заголовки для каждого из двух столбцов?

См., Например, в прикрепленном изображении я хочу, чтобы столбец «Контакт» имел заголовки «Телефон» и «Адрес» для соответствующих столбцов.

Спасибо заранее.

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

Добавить еще одну строку и добавить заголовки в <td /> теги. Может быть, дать строке класс и стиль текста td? Таким образом, они не будут выглядеть идентичными реальным заголовкам, что может вызвать путаницу.

Answer 3

Вам нужно иметь две отдельные строки заголовка:

<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 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>