tablas ​

las tablas también son un elemento esencial que se conforma por filas y columnas por medio de celdas pero poco usadas sirve para aplicaciones web tipo CRUD, horarios de clases para colegios o para documentación.

etiqueta table ​

esta etiqueta representa el esqueleto de la tabla para colocar el encabezado, el cuerpo y pie de pagina.

todo los atributos de la etiqueta table no sera mencionadas son parecidos a los elementos multimedia y son empleados por medio de CSS.

<table>
  <tr>
    <td>John</td>
    <td>Doe</td>
  </tr>
  <tr>
    <td>Jane</td>
    <td>Doe</td>
  </tr>
</table>

<table>
  <tr>
    <td>John</td>
    <td>Doe</td>
  </tr>
  <tr>
    <td>Jane</td>
    <td>Doe</td>
  </tr>
</table>

etiqueta thead ​

esta etiqueta en función semántica representa el encabezado de la tabla.

<thead>
  <tr>
    <th scope="col">Items</th>
    <th scope="col">Expenditure</th>
  </tr>
</thead>

<thead>
  <tr>
    <th scope="col">Items</th>
    <th scope="col">Expenditure</th>
  </tr>
</thead>

etiqueta tbody ​

esta etiqueta en función semántica representa el cuerpo de la tabla.

<tbody>
  <tr>
    <td scope="col">Items</td>
    <td scope="col">Expenditure</td>
  </tr>
</tbody>

<tbody>
  <tr>
    <td scope="col">Items</td>
    <td scope="col">Expenditure</td>
  </tr>
</tbody>

etiqueta tfoot ​

esta etiqueta en función semántica representa el pie de pagina de la tabla.

<thead>
  <tr>
    <th scope="row">Totals</th>
    <td>21,000</td>
  </tr>
</thead>

<thead>
  <tr>
    <th scope="row">Totals</th>
    <td>21,000</td>
  </tr>
</thead>

etiqueta tr ​

esta etiqueta en función semántica representa la fila de la tabla puede contener tanto th como td.

<tr>
  <th scope="row">Totals</th>
  <td>21,000</td>
</tr>

<tr>
  <th scope="row">Totals</th>
  <td>21,000</td>
</tr>

etiqueta th ​

esta etiqueta en función semántica representa dato importante de la tabla es usando mucho en los thead.

<th scope="row">Totals</th>

<th scope="row">Totals</th>

etiqueta td ​

esta etiqueta representa la celda de una tabla en pocas palabras una columna.

<td>21,000</td>

<td>21,000</td>

sus atributos son iguales al th excepto el atributo abbr que es un atributo obsoleto / desfasados.

etiqueta caption ​

representa el titulo de la tabla o una descripción similar a figcaption se debe colocar dentro de la etiqueta table.

<caption>Example Caption</caption>

<caption>Example Caption</caption>

etiqueta colgroup ​

esta etiqueta define el grupo de columnas de una tabla para que funcione debe esta adentro de la etiqueta table.

<colgroup>
  <col>
  <col span="2" class="batman">
  <col span="2" class="flash">
</colgroup>

<colgroup>
  <col>
  <col span="2" class="batman">
  <col span="2" class="flash">
</colgroup>

etiqueta col ​

esta etiqueta define cuantas columnas debe ocupar un th o td.

<col span="2" class="batman">

<col span="2" class="batman">