diff options
| -rw-r--r-- | docs/4.0/content/tables.md | 80 | ||||
| -rw-r--r-- | scss/_tables.scss | 6 |
2 files changed, 86 insertions, 0 deletions
diff --git a/docs/4.0/content/tables.md b/docs/4.0/content/tables.md index 59bdb6373..23ba594f8 100644 --- a/docs/4.0/content/tables.md +++ b/docs/4.0/content/tables.md @@ -298,6 +298,86 @@ Add `.table-bordered` for borders on all sides of the table and cells. </table> {% endexample %} +## Borderless table + +Add `.table-borderless` for a table without borders. + +{% example html %} +<table class="table table-borderless"> + <thead> + <tr> + <th scope="col">#</th> + <th scope="col">First Name</th> + <th scope="col">Last Name</th> + <th scope="col">Username</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">1</th> + <td>Mark</td> + <td>Otto</td> + <td>@mdo</td> + </tr> + <tr> + <th scope="row">2</th> + <td>Mark</td> + <td>Otto</td> + <td>@TwBootstrap</td> + </tr> + <tr> + <th scope="row">3</th> + <td>Jacob</td> + <td>Thornton</td> + <td>@fat</td> + </tr> + <tr> + <th scope="row">4</th> + <td colspan="2">Larry the Bird</td> + <td>@twitter</td> + </tr> + </tbody> +</table> +{% endexample %} + +{% example html %} +<table class="table table-borderless table-dark"> + <thead> + <tr> + <th scope="col">#</th> + <th scope="col">First Name</th> + <th scope="col">Last Name</th> + <th scope="col">Username</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">1</th> + <td>Mark</td> + <td>Otto</td> + <td>@mdo</td> + </tr> + <tr> + <th scope="row">2</th> + <td>Mark</td> + <td>Otto</td> + <td>@TwBootstrap</td> + </tr> + <tr> + <th scope="row">3</th> + <td>Jacob</td> + <td>Thornton</td> + <td>@fat</td> + </tr> + <tr> + <th scope="row">4</th> + <td colspan="2">Larry the Bird</td> + <td>@twitter</td> + </tr> + </tbody> +</table> +{% endexample %} + ## Hoverable rows Add `.table-hover` to enable a hover state on table rows within a `<tbody>`. diff --git a/scss/_tables.scss b/scss/_tables.scss index 6bd0b91a4..0f721d7c5 100644 --- a/scss/_tables.scss +++ b/scss/_tables.scss @@ -151,6 +151,12 @@ } } +.table-borderless { + th, + td { + border: 0; + } +} // Responsive tables // |