Правильный способ организации таблиц

Question

У меня есть эта разметка

<div id="standards"> 
<table border="1"> 
    <thead> 
     <tr> 
      <th>Markup</th> 
      <th colspan="4">HTML</th> 
      <th colspan="4">XHTML</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <th>Version</th> 
      <td colspan="3">4.01</td> 
      <td>5</td> 
      <td colspan="3">1.0</td> 
      <td>5</td> 
     </tr> 
     <tr> 
      <th>Flavour</th> 
      <td>Strict</td> 
      <td>Transitional</td> 
      <td>Frameset</td> 
      <td>N/A</td> 
      <td>Strict</td> 
      <td>Transitional</td> 
      <td>Frameset</td> 
      <td>N/A</td> 
     </tr> 
     <tr> 
      <th>Support</th> 
      <td>Yes</td> 
      <td>Yes</td> 
      <td>Yes</td> 
      <td>Yes</td> 
      <td>Yes</td> 
      <td>Yes</td> 
      <td>Yes</td> 
      <td>Yes</td> 
     </tr> 
    </tbody> 

Мой вопрос я должен оставить первый и второй «TR» в «TBODY», как сейчас, или должны Я перемещаю их в «thead» с точки зрения семантики. Таблица, как видно, имеет 3 заголовка. Каков был бы правильный способ сделать это? Вот скрипка

Fiddle

Answer 1

Вы можете иметь несколько <tr> «s в <thead> согласно документации w3 для HTML4 и HTML5 и делать, что будет соответствовать вашей таблицы с точки зрения семантики, так что идти вперед и переместить их в THEAD.

Answer 2

Если эта таблица действительно имеет 3 строки заголовков (не данные), положить их в <thead>.

<td> предназначено для реальных данных вообще.

Нет ничего плохого в <th> в строке таблицы, это указывает на то, что ячейка является заголовком для этой конкретной строки.

Вы в порядке, как есть.