Table

Semantic table with an optional horizontally scrolling wrapper.

Basic structure

div.table-container > table.table

Try it StripedHoverableBordered

Example capability table
Component	Purpose
Card	One surface with optional regions
Figure	Meaningful media and caption
Exhibit	Artwork and content composition

HTML

<div class="table-container"><table class="table"><caption>Example capability table</caption><thead><tr><th scope="col">Component</th><th scope="col">Purpose</th></tr></thead><tbody><tr><th scope="row">Card</th><td>One surface with optional regions</td></tr><tr><th scope="row">Figure</th><td>Meaningful media and caption</td></tr><tr><th scope="row">Exhibit</th><td>Artwork and content composition</td></tr></tbody></table></div>

Options

Class or attribute	What it does
`is-striped / is-hoverable / is-bordered`	Independent row and border treatments.
`caption / th[scope]`	Native table labeling and header associations.