Tables are used to house content.
Presentation
Standard Table (.table)
A | B |
---|---|
1 | 2 |
3 | 4 |
HTML
<table class="table"> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </tbody> </table>
Striped (.table.table-striped)
A | B |
---|---|
1 | 2 |
3 | 4 |
<table class="table table-striped"> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </tbody> </table>
Tight (.table.table-tight)
A | B |
---|---|
1 | 2 |
3 | 4 |
<table class="table table-tight"> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </tbody> </table>
Half (.table.table-half)
A | B |
---|---|
1 | 2 |
3 | 4 |
<table class="table table-half"> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </tbody> </table>
Hoverable (.table.table-hoverable)
A | B |
---|---|
1 | 2 |
3 | 4 |
<table class="table table-hoverable"> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </tbody> </table>
Borderless (.table.table-borderless)
A | B |
---|---|
1 | 2 |
3 | 4 |
<table class="table table-borderless"> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </tbody> </table>
All of them!
A | B |
---|---|
1 | 2 |
3 | 4 |
<table class="table table-borderless table-half table-tight table-striped table-hoverable"> <thead> <tr> <th>A</th> <th>B</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> </tbody> </table>