What's the difference between <th> and <thead>?

#1

<th.>-------------> table heading
<thead.>-------->table heading

What’s the difference?

#2

A lot, actually. There is only one THEAD and multiple TH, for starters.

<table>
  <caption>THEAD vs TH</caption>
  <thead>
    <tr><th colspan="3">TRUTH TABLE</th></tr>
  </thead>
  <tbody>
    <tr>
      <td>AND</td>
      <th scope="col">true</th>
      <th scope="col">false</th>
    </tr>
    <tr>
      <th scope="row">true</th>
      <td>true</td>
      <td>false</td>
    </tr>
    <tr>
      <th scope="row">false</th>
      <td>false</td>
      <td>false</td>
    </tr>
  </tbody>
</table>

When styled with this CSS,

table {
  border-collapse: separate;
  border: 1px solid black;
  width: 12em;
  margin: 1em auto;
}
th, td {
  padding: 5px;
  border: 1px solid red;
}
td {
  text-align: center;
}

gives the following result…

truth-table

https://repl.it/@mtf/truth-table

Spanning Rows
#3

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.