@alterebro

Estructura de una tabla XHTML semanticamente correcta. A tener en cuenta el uso poco frecuente de scope y headers al igual que el uso corercto de los th y el atributo summary.

<!-- HTML -->
<table summary="Este es el resumen de la tabla">
 <caption>Lorem Ipsum Dolor Sit Amet</caption>
 <thead>
  <tr>
   <th id="columna-elementos" scope="col">Elementos</th>
   <th id="cabecera1" scope="col">Cabecera1</th>
   <th id="cabecera2" scope="col">Cabecera2</th>
  </tr>
 </thead>
 <tfoot>
  <tr>
   <td colspan="3">Este es el footer</td>
  </tr>
 </tfoot>
 <tbody>
  <tr>
   <th id="linea1" scope="row">Elemento #1</th>
   <td headers="columna-elementos cabecera1">Lorem Ipsum</td>
   <td headers="columna-elementos cabecera2">Lorem Ipsum</td>
  </tr>
  <tr>
   <th id="linea2" scope="row">Elemento #2</th>
   <td headers="columna-elementos cabecera1">Lorem Ipsum</td>
   <td headers="columna-elementos cabecera2">Lorem Ipsum</td>
  </tr>
 </tbody>
</table>

/* CSS */
/* Elimina espacios y margenes entre las celdas de la tabla. */
table, thead, tbody, tr, td {
 padding: 0;
 margin: 0;
 border: 0;
 border-collapse: collapse;
 border-spacing: 0;
}

Etiquetas: css, html, xhtml