Tables
Tables are styled for you automatically — no special classes required.
<table>
<thead>
<tr><th>Item</th><th>Price</th></tr>
</thead>
<tbody>
<tr><td>Shoe Freshener</td><td>$4.79</td></tr>
<tr><td>Shoe Glue</td><td>$2.50</td></tr>
<tr><td>Shoe Polish</td><td>$5.25</td></tr>
<tr><td>Shoelaces</td><td>$3.99</td></tr>
</tbody>
</table>
Item | Price |
---|---|
Shoe Freshener | $4.79 |
Shoe Glue | $2.50 |
Shoe Polish | $5.25 |
Shoelaces | $3.99 |
Striped Tables
Use the table-striped
modifier to add stripes to alternating rows.
<table class="table-striped">
...
</table>
Item | Price |
---|---|
Shoe Freshener | $4.79 |
Shoe Glue | $2.50 |
Shoe Polish | $5.25 |
Shoelaces | $3.99 |
Bordered Tables
Use the table-bordered
modifier to add a border to the table.
<table class="table-bordered">
...
</table>
Item | Price |
---|---|
Shoe Freshener | $4.79 |
Shoe Glue | $2.50 |
Shoe Polish | $5.25 |
Shoelaces | $3.99 |
Hoverable Rows
Use the table-hoverable
modifier to enable the hover state on table rows.
<table class="table-hoverable">
...
</table>
Item | Price |
---|---|
Shoe Freshener | $4.79 |
Shoe Glue | $2.50 |
Shoe Polish | $5.25 |
Shoelaces | $3.99 |