mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-30 15:24:08 +03:00
Code Activity

Update and document use of small in headings

Browse Source
This commit is contained in:
Mark Otto
2013-08-23 14:22:51 -07:00
parent 310642d5ac
commit 2b37d2b533
5 changed files with 75 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css.html
+47 -13
View File
@@ -588,46 +588,80 @@ base_url: "../"
<!-- Headings -->
<h2 id="type-headings">Headings</h2>
<p>All HTML headings, <code>&lt;h1&gt;</code> through <code>&lt;h6&gt;</code> are available.</p>
<div class="bs-example bs-example-type">
<table class="table">
<tbody>
<tr>
<td><h1>h1. Bootstrap heading</h1></td>
<td>Semibold 36px</td>
<td class="info">Semibold 36px</td>
</tr>
<tr>
<td><h2>h2. Bootstrap heading</h2></td>
<td>Semibold 30px</td>
<td class="info">Semibold 30px</td>
</tr>
<tr>
<td><h3>h3. Bootstrap heading</h3></td>
<td>Semibold 24px</td>
<td class="info">Semibold 24px</td>
</tr>
<tr>
<td><h4>h4. Bootstrap heading</h4></td>
<td>Semibold 18px</td>
<td class="info">Semibold 18px</td>
</tr>
<tr>
<td><h5>h5. Bootstrap heading</h5></td>
<td>Semibold 14px</td>
<td class="info">Semibold 14px</td>
</tr>
<tr>
<td><h6>h6. Bootstrap heading</h6></td>
<td>Semibold 12px</td>
<td class="info">Semibold 12px</td>
</tr>
</tbody>
</table>
</div>
{% highlight html %}
<h1>...</h1>
<h2>...</h2>
<h3>...</h3>
<h4>...</h4>
<h5>...</h5>
<h6>...</h6>
<h1>h1. Bootstrap heading</h1>
<h2>h2. Bootstrap heading</h2>
<h3>h3. Bootstrap heading</h3>
<h4>h4. Bootstrap heading</h4>
<h5>h5. Bootstrap heading</h5>
<h6>h6. Bootstrap heading</h6>
{% endhighlight %}
<p>Also included with headings is an autoscaling <code>&lt;small&gt;</code> element. Use it for smaller, gray secondary text in any heading.</p>
<div class="bs-example bs-example-type">
<table class="table">
<tbody>
<tr>
<td><h1>h1. Bootstrap heading <small>Secondary text</small></h1></td>
</tr>
<tr>
<td><h2>h2. Bootstrap heading <small>Secondary text</small></h2></td>
</tr>
<tr>
<td><h3>h3. Bootstrap heading <small>Secondary text</small></h3></td>
</tr>
<tr>
<td><h4>h4. Bootstrap heading <small>Secondary text</small></h4></td>
</tr>
<tr>
<td><h5>h5. Bootstrap heading <small>Secondary text</small></h5></td>
</tr>
<tr>
<td><h6>h6. Bootstrap heading <small>Secondary text</small></h6></td>
</tr>
</tbody>
</table>
</div>
{% highlight html %}
<h1>h1. Bootstrap heading <small>Secondary text</small></h1>
<h2>h2. Bootstrap heading <small>Secondary text</small></h2>
<h3>h3. Bootstrap heading <small>Secondary text</small></h3>
<h4>h4. Bootstrap heading <small>Secondary text</small></h4>
<h5>h5. Bootstrap heading <small>Secondary text</small></h5>
<h6>h6. Bootstrap heading <small>Secondary text</small></h6>
{% endhighlight %}
<!-- Body copy -->
<h2 id="type-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>1.428</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 computed line-height (10px by default).</p>