Bootstrap Typography

Bootstrap uses Helvetica Neue, Helvetica, Arial, and sans-serif in its default font, font-size of 14px, and a line height of 1.428. In addition, <p> receive a bottom margin of half their computed line-height (10px by default).

Using typography feature of Bootstrap you can create headings, paragraphs, lists and other inline elements.

Headings:  Bootstrap formats heading differently from that of browser default.

<small> element will create a lighter, secondary text in any heading

<mark>highlight</mark>
<abbr title="World Health Organization">WHO</abbr>
<del>This is deleted text</del>
<blockquote>
     <p>This is some descriptive text This is some descriptive text This is some descriptive text This is some
descriptive text This is some descriptive text This is some descriptive text This is some descriptive text </p>
     <footer>From Author Name</footer>
 </blockquote>
Note: Add .blockquote-reverse for a blockquote to right-aligned content.
<small>This content is within small tag</small><br>
<strong>This content is within strong tag</strong><br>
<em>This content is within em tag and is rendered as italics</em><br>
<p class="lead">This is an example paragraph demonstrating the use of lead body copy.</p>
<p class="text-left">Left aligned text.</p>
<p class="text-center">Center aligned text.</p>
<p class="text-right">Right aligned text.</p>
<p class="text-muted">This content is muted</p>
<p class="text-primary">This content carries a primary class</p>
<p class="text-success">This content carries a success class</p>
<p class="text-info">This content carries a info class</p>
<p class="text-warning">This content carries a warning class</p>
<p class="text-danger">This content carries a danger class</p>
<p class="text-lowercase">Lowercased text.</p>
<p class="text-uppercase">Uppercased text.</p>
<p class="text-capitalize">Capitalized text.</p>
<address>
    <strong>Some Company Pvt Ltd...</strong><br>
    Street No 007<br>
    Some City, State XXXXX<br>
    <abbr title="Phone">P:</abbr> (123) 456-7890
</address>
<address>
    <strong>James</strong><br>
    <a href="mailto:mailto@somedomain.com">mailto@somedomain.com</a>
</address>
<h4>Example of Ordered List</h4>
<ol>
    <li>Item 1</li>
    <li>Item 2</li>
</ol>
<h4>Example of Un-Ordered List</h4>
<ul>
    <li>Item 1</li>
    <li>Item 2</li>
</ul>
<h4>Example of Unstyled List</h4>
<ul class="list-unstyled">
    <li>Item 1</li>
    <li>Item 2</li>
</ul>
<h4>Example of Inline List - Place all list items on a single line and some light padding.</h4>
<ul class="list-inline">
    <li>Item 1</li>
    <li>Item 2</li>
</ul>
<h4>Example of Definition List</h4>
<dl>
    <dt>Description 1</dt>
    <dd>This is description of Item 1</dd>
<dt>Description 2</dt>
    <dd>This is description of Item 2</dd>
</dl>
<h4>Example of Horizontal Definition List</h4>
<dl class="dl-horizontal">
    <dt>Description 1</dt>
    <dd>This is description of Item 1</dd>
    <dt>Description 2</dt>
    <dd>This is description of Item 2</dd>
</dl>
<code>&lt;header&gt;</code> is wrapped as an inline element.
To display code as a standalone block element use &lt;pre&gt; tag as:
<pre>
&lt;article&gt;
   &lt;h1&gt;Article Heading&lt;/h1&gt;
&lt;/article&gt;
public class HomeController : Controller
{
    //
    // GET: /Home/
    public ActionResult Index()
    {
        return View();
    }
}
</pre>