7.8 base.table Tables

Toggle example guides Toggle HTML markup

The <table> element displays tabular data in rows, columns, and cells.

Example
Optional table caption.
# First Name Last Name Username
1 Jane Doe jdoe
2 Jamie Morgan jmorgan
3 Jacob Smith jsmith
# First Name Last Name Username
Markup: base/tables/tables-table.twig 
<table class="{{modifier_class}}">
  <caption>Optional table caption.</caption>
  <thead>
    <tr>
      <th>#</th>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Username</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>Jane</td>
      <td>Doe</td>
      <td>jdoe</td>
    </tr>
    <tr>
      <td>2</td>
      <td>Jamie</td>
      <td>Morgan</td>
      <td>jmorgan</td>
    </tr>
    <tr>
      <td>3</td>
      <td>Jacob</td>
      <td>Smith</td>
      <td>jsmith</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <th>#</th>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Username</th>
    </tr>
  </tfoot>
</table>
Source: base/tables/_tables.scss, line 1