mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
Add text alignment utility classes
This commit is contained in:
parent
3d04d9ba75
commit
91dd77939b
4 changed files with 42 additions and 0 deletions
12
docs/assets/css/bootstrap.css
vendored
12
docs/assets/css/bootstrap.css
vendored
|
@ -510,6 +510,18 @@ a.text-success:hover {
|
|||
color: #356635;
|
||||
}
|
||||
|
||||
.text-left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.text-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
|
|
|
@ -305,6 +305,19 @@
|
|||
|
||||
<p>Feel free to use <code><b></code> and <code><i></code> in HTML5. <code><b></code> is meant to highlight words or phrases without conveying additional importance while <code><i></code> is mostly for voice, technical terms, etc.</p>
|
||||
|
||||
<h3>Alignment classes</h3>
|
||||
<p>Easily realign text to components with text alignment classes.</p>
|
||||
<div class="bs-docs-example">
|
||||
<p class="text-left">Left aligned text.</p>
|
||||
<p class="text-center">Center aligned text.</p>
|
||||
<p class="text-right">Right aligned text.</p>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<p class="text-left">Left aligned text.</p>
|
||||
<p class="text-center">Center aligned text.</p>
|
||||
<p class="text-right">Right aligned text.</p>
|
||||
</pre>
|
||||
|
||||
<h3>Emphasis classes</h3>
|
||||
<p>Convey meaning through color with a handful of emphasis utility classes.</p>
|
||||
<div class="bs-docs-example">
|
||||
|
|
13
docs/templates/pages/css.mustache
vendored
13
docs/templates/pages/css.mustache
vendored
|
@ -242,6 +242,19 @@
|
|||
|
||||
<p>Feel free to use <code><b></code> and <code><i></code> in HTML5. <code><b></code> is meant to highlight words or phrases without conveying additional importance while <code><i></code> is mostly for voice, technical terms, etc.</p>
|
||||
|
||||
<h3>Alignment classes</h3>
|
||||
<p>Easily realign text to components with text alignment classes.</p>
|
||||
<div class="bs-docs-example">
|
||||
<p class="text-left">Left aligned text.</p>
|
||||
<p class="text-center">Center aligned text.</p>
|
||||
<p class="text-right">Right aligned text.</p>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<p class="text-left">Left aligned text.</p>
|
||||
<p class="text-center">Center aligned text.</p>
|
||||
<p class="text-right">Right aligned text.</p>
|
||||
</pre>
|
||||
|
||||
<h3>Emphasis classes</h3>
|
||||
<p>Convey meaning through color with a handful of emphasis utility classes.</p>
|
||||
<div class="bs-docs-example">
|
||||
|
|
|
@ -40,6 +40,10 @@ a.text-error:hover { color: darken(@state-error-text, 10%); }
|
|||
.text-success { color: @state-success-text; }
|
||||
a.text-success:hover { color: darken(@state-success-text, 10%); }
|
||||
|
||||
.text-left { text-align: left; }
|
||||
.text-right { text-align: right; }
|
||||
.text-center { text-align: center; }
|
||||
|
||||
|
||||
// Headings
|
||||
// -------------------------
|
||||
|
|
Loading…
Reference in a new issue