try out new table-based type example

This commit is contained in:
Mark Otto 2013-02-24 01:29:19 -08:00
parent c6343a9d4a
commit e1bb94c383
2 changed files with 59 additions and 2 deletions

View File

@ -243,6 +243,31 @@ section > ul li {
margin-bottom: 0;
}
/* Typography */
.bs-docs-example-type .table td {
color: #999;
vertical-align: middle;
border-color: ;
}
.bs-docs-example-type .table td,
.bs-docs-example-type .table th {
padding: 15px 0;
border-color: #eee;
}
.bs-docs-example-type .table tr:first-child td,
.bs-docs-example-type .table tr:first-child th {
border-top: 0;
}
.bs-docs-example-type h1,
.bs-docs-example-type h2,
.bs-docs-example-type h3,
.bs-docs-example-type h4,
.bs-docs-example-type h5,
.bs-docs-example-type h6 {
margin: 0;
}
/* Navbar examples */
.bs-navbar-top-example,
.bs-navbar-bottom-example {

View File

@ -90,7 +90,39 @@ title: CSS
<!-- Headings -->
<h2 id="headings">Headings</h2>
<p>All HTML headings, <code>&lt;h1&gt;</code> through <code>&lt;h6&gt;</code> are available.</p>
<div class="bs-docs-example">
<div class="bs-docs-example bs-docs-example-type">
<table class="table">
<tbody>
<tr>
<th><h1>Bootstrap heading</h1></th>
<td>Semibold 38px</td>
</tr>
<tr>
<th><h2>Bootstrap heading</h2></th>
<td>Semibold 32px</td>
</tr>
<tr>
<th><h3>Bootstrap heading</h3></th>
<td>Semibold 24px</td>
</tr>
<tr>
<th><h4>Bootstrap heading</h4></th>
<td>Semibold 18px</td>
</tr>
<tr>
<th><h5>Bootstrap heading</h5></th>
<td>Semibold 16px</td>
</tr>
<tr>
<th><h6>Bootstrap heading</h6></th>
<td>Semibold 12px</td>
</tr>
</tbody>
</table>
</div>
<!-- <div class="bs-docs-example">
<h1>h1. Heading 1</h1>
<h2>h2. Heading 2</h2>
<h3>h3. Heading 3</h3>
@ -98,7 +130,7 @@ title: CSS
<h5>h5. Heading 5</h5>
<h6>h6. Heading 6</h6>
</div>
-->
<!-- Body copy -->
<h2 id="body-copy">Body copy</h2>
<p>Bootstrap's global default <code>font-size</code> is <strong>14px</strong>, with a <code>line-height</code> of <strong>20px</strong>. This is applied to the <code>&lt;body&gt;</code> and all paragraphs. In addition, <code>&lt;p&gt;</code> (paragraphs) receive a bottom margin of half their line-height (10px by default).</p>