Bootstrap Labels

Bootstrap Labels
Simple-Labels

<h1> Example Heading <span class="label label-default">Label</span></h1> <h2> Example Heading <span class="label label-default">Label</span></h2> <h3> Example Heading <span class="label label-default">Label</span></h3> <h4> Example Heading <span class="label label-default">Label</span></h4>

Label-with-color

<span class="label label-default">Default Label</span> <span class="label label-primary">Primary Label</span> <span class="label label-success">Success Label</span> <span class="label label-info">Info Label</span> <span class="label label-warning">Warning Label</span> <span class="label label-danger">Danger Label</span>

Bootstrap Badges

Badges are similar to labels; the primary difference is that the corners are more rounded.
 Badges are mainly used to highlight new or unread items.

 To use badges just add <span class="badge"> to links, Bootstrap navs, and more.

<a href="#">Mailbox <span class="badge">50</span></a>

Active nav states

<h4> Example for Active State in Pill </h4> <ul class="nav nav-pills"> <li class="active"><a href="#">Home <span class="badge">42</span></a></li> <li><a href="#">Profile</a></li> <li><a href="#">Messages <span class="badge">3</span></a></li> </ul> <br> <h4> Example for Active State in navigations</h4> <ul class="nav nav-pills nav-stacked" style="max-width: 260px;"> <li class="active"> <a href="#"> <span class="badge pull-right">42</span> Home </a> </li> <li><a href="#">Profile</a></li> <li> <a href="#"> <span class="badge pull-right">3</span> Messages</a> </li> </ul>

Bootstrap Jumpotron

<div class="container"> <div class="jumbotron"> <h1> Welcome to landing page!</h1> <p> This is an example for jumbotron.</p> <p> <a class="btn btn-primary btn-lg" role="button"> Learn more</a> </p> </div> </div>


Bootstrap Page Header

<div class="page-header"> <h1> Example page header <small>Subtext for header</small> </h1> </div> <p> This is a sample text.This is a sample text.This is a sample text. This is a sample text.</p>