<table id="sem-collapse">
  <thead>
    <tr>
      <th colspan="2">Sem collapse</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Cabeçalho 1</td>
      <td>Cabeçalho 2</td>
    </tr>
    <tr>
      <td>Dados 1</td>
      <td>Dados 2</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>Footer 1</td>
      <td>Footer 2</td>
    </tr>
  </tfoot>
</table>
<hr>
<table id="com-collapse">
  <thead>
    <tr>
      <th colspan="2">Com collapse</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Cabeçalho 1</td>
      <td>Cabeçalho 2</td>
    </tr>
    <tr>
      <td>Dados 1</td>
      <td>Dados 2</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>Footer 1</td>
      <td>Footer 2</td>
    </tr>
  </tfoot>
</table>
/* bordas para todos */
#com-collapse th, #com-collapse td,
#sem-collapse th, #sem-collapse td {
  border: 1px solid black;
}
/* colapsando só a segunda tabela */
#com-collapse {
  border-collapse: collapse;
}

/* ignore */
#com-collapse,#sem-collapse {border-padding:4px;}
#com-collapse td, #com-collapse th,
#sem-collapse td, #sem-collapse th {padding:7px}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.