diff options
| author | Patrick Yeo <[email protected]> | 2017-08-18 18:23:06 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2017-08-21 18:20:14 -0700 |
| commit | 5c95dcc300b2f05f99f71347631b0f5dc2ddffe6 (patch) | |
| tree | 1d85dc3bc5c8e0120c5271bf2922e6658828c8f1 /docs | |
| parent | 3bf3bdf420833ed929c999f98dd7e3fa8708b683 (diff) | |
| download | bootstrap-5c95dcc300b2f05f99f71347631b0f5dc2ddffe6.tar.xz bootstrap-5c95dcc300b2f05f99f71347631b0f5dc2ddffe6.zip | |
v4 docs Update Table docs with `.table-dark` and `.thead-light` changes
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/4.0/content/tables.md | 22 |
1 files changed, 11 insertions, 11 deletions
diff --git a/docs/4.0/content/tables.md b/docs/4.0/content/tables.md index db05e8378..9de7c5553 100644 --- a/docs/4.0/content/tables.md +++ b/docs/4.0/content/tables.md @@ -45,10 +45,10 @@ Using the most basic table markup, here's how `.table`-based tables look in Boot </table> {% endexample %} -You can also invert the colors—with light text on dark backgrounds—with `.table-inverse`. +You can also invert the colors—with light text on dark backgrounds—with `.table-dark`. {% example html %} -<table class="table table-inverse"> +<table class="table table-dark"> <thead> <tr> <th>#</th> @@ -82,11 +82,11 @@ You can also invert the colors—with light text on dark backgrounds—with `.ta ## Table head options -Similar to default and inverse tables, use one of two modifier classes to make `<thead>`s appear light or dark gray. +Similar to tables and dark tables, use the modifier classes `.thead-light` or `.thead-dark` to make `<thead>`s appear light or dark gray. {% example html %} <table class="table"> - <thead class="thead-inverse"> + <thead class="thead-dark"> <tr> <th>#</th> <th>First Name</th> @@ -117,7 +117,7 @@ Similar to default and inverse tables, use one of two modifier classes to make ` </table> <table class="table"> - <thead class="thead-default"> + <thead class="thead-light"> <tr> <th>#</th> <th>First Name</th> @@ -186,7 +186,7 @@ Use `.table-striped` to add zebra-striping to any table row within the `<tbody>` {% endexample %} {% example html %} -<table class="table table-striped table-inverse"> +<table class="table table-striped table-dark"> <thead> <tr> <th>#</th> @@ -261,7 +261,7 @@ Add `.table-bordered` for borders on all sides of the table and cells. {% endexample %} {% example html %} -<table class="table table-bordered table-inverse"> +<table class="table table-bordered table-dark"> <thead> <tr> <th>#</th> @@ -335,7 +335,7 @@ Add `.table-hover` to enable a hover state on table rows within a `<tbody>`. {% endexample %} {% example html %} -<table class="table table-hover table-inverse"> +<table class="table table-hover table-dark"> <thead> <tr> <th>#</th> @@ -403,7 +403,7 @@ Add `.table-sm` to make tables more compact by cutting cell padding in half. {% endexample %} {% example html %} -<table class="table table-sm table-inverse"> +<table class="table table-sm table-dark"> <thead> <tr> <th>#</th> @@ -487,10 +487,10 @@ Use contextual classes to color table rows or individual cells. </tr> {% endhighlight %} -Regular table background variants are not available with the inverse table, however, you may use [text or background utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/colors/) to achieve similar styles. +Regular table background variants are not available with the dark table, however, you may use [text or background utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/colors/) to achieve similar styles. <div class="bd-example"> - <table class="table table-inverse"> + <table class="table table-dark"> <thead> <tr> <th>#</th> |
