Bootstrap Labels and Badges

Bootstrap's label classes is used to indicate user about some additional information that's appended to a string of text.

Example of Code

<h1>Bootstrap heading <span class="label label-default">New</span></h1>
<h2>Bootstrap heading <span class="label label-default">New</span></h2>
<h3>Bootstrap heading <span class="label label-default">New</span></h3>
<h4>Bootstrap heading <span class="label label-default">New</span></h4>
<h5>Bootstrap heading <span class="label label-default">New</span></h5>
<h6>Bootstrap heading <span class="label label-default">New</span></h6>

Output

Bootstrap heading New

Bootstrap heading New

Bootstrap heading New

Bootstrap heading New

Bootstrap heading New

Bootstrap heading New

Badges are basically used to highlight some valuable information on the web pages like as important heading, warning messages, notification counter, etc.

Example of Code

<button type="button" class="btn btn-primary">Primary label<span class="badge">1</span></button>
<button type="button" class="btn btn-success">Success<span class="badge"></span>2</button>
<button type="button" class="btn btn-info">Info<span class="badge"></span>3</button>

Output

Primary label1Success2Info3