diff options
| author | Mark Otto <[email protected]> | 2011-11-29 23:16:38 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2011-11-29 23:16:38 -0800 |
| commit | 0c8d2e37e76db3d3b47ca9eb5340def031b9196b (patch) | |
| tree | 19e953461d8401ba46436f16eae996503dd9fec6 /docs | |
| parent | 8f3150cf7158d3d949e59fed44112350c0724b74 (diff) | |
| download | bootstrap-0c8d2e37e76db3d3b47ca9eb5340def031b9196b.tar.xz bootstrap-0c8d2e37e76db3d3b47ca9eb5340def031b9196b.zip | |
adding bordered table to docs and showing it works with colspan
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/base-css.html | 39 |
1 files changed, 37 insertions, 2 deletions
diff --git a/docs/base-css.html b/docs/base-css.html index bab55f0e4..7626d1668 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -630,7 +630,42 @@ <table class="striped-table"> ... </table></pre> - <h3>3. Condensed table</h3> + <h3>3. Bordered table</h3> + <p>Add borders around the entire table and between each row, plus a bit of rounded corners for aesthetic purposes.</p> + <table class="bordered-table"> + <thead> + <tr> + <th>#</th> + <th>First Name</th> + <th>Last Name</th> + <th>Language</th> + </tr> + </thead> + <tbody> + <tr> + <td>1</td> + <td colspan="2">Some One</td> + <td>English</td> + </tr> + <tr> + <td colspan="2">2 Joe</td> + <td>Sixpack</td> + <td>English</td> + </tr> + <tr> + <td>3</td> + <td>Stu</td> + <td>Dent</td> + <td>Code</td> + </tr> + </tbody> + </table> + <p><strong>Note:</strong> Zebra-striping is a progressive enhancement not available for older browsers like IE8 and below.</p> +<pre class="prettyprint linenums"> +<table class="striped-table"> + ... +</table></pre> + <h3>4. Condensed table</h3> <p>Make your tables more compact by adding the <code>.condensed-table</code> class to cut table cell padding in half (from 10px to 5px).</p> <table class="condensed-table"> <thead> @@ -666,7 +701,7 @@ <table class="condensed-table"> ... </table></pre> - <h3>4. Striped table w/ TableSorter.js</h3> + <h3>5. Striped table w/ TableSorter.js</h3> <p>Taking the previous example, we improve the usefulness of our tables by providing sorting functionality via <a href="http://jquery.com">jQuery</a> and the <a href="http://tablesorter.com/docs/">Tablesorter</a> plugin. <strong>Click any column’s header to change the sort.</strong></p> <table class="striped-table" id="sortTableExample"> <thead> |