×
FREE ASSISTANCE FOR THE INQUISITIVE PEOPLE
Tutorial Topics
X
softetechnologies
Bootstrap Alert [Success | Info | Warning | Danger] Bootstrap Badges [ use of .badge class ]
Bootstrap Labels [ use of .label class ] - Bootstrap 3
2909    Arnab De    17/05/2017

Bootstrap Labels

Bootstrap Labels is use to display some additional information to the text or link. It is generally use for display some extra information about the link or any heading. Assume we add a new paragraph in our documents and try to indicate it. Then we can use the label to indicate it. We must use the .label class to create bootstrap label. To create a label we must use <span> tag.

softetechnologies

<html>
<head>
<title>Badge Examples</title>
<link rel="stylesheet" href="bootstrap.min.css">
<style>
div
{
width:500px;
position:relative;
top:100px;
left:100px;
font-weight:bold;
}
</style>
</head>
<div>
<h1>Example New Topic<span class="label label-danger">new</span></h1>
</div>
</html>

Bootstrap Label
Bootstrap Label

Types of Bootstrap Labels

Six types of labels are possible in bootstrap. We use the following classes for different type of the Labels.

  • label-default
  • label-primary
  • label-success
  • label-info
  • label-warning
  • label-danger
softetechnologies

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

Bootstrap Label Types Types Of Bootstrap Label
Bootstrap Label Types
Bootstrap Label Types
Bootstrap Alert [Success | Info | Warning | Danger] Bootstrap Badges [ use of .badge class ]
softetechnologies
Author Details
Arnab De
I have over 16 years of experience working as an IT professional, ranging from teaching at my own institute to being a computer faculty at different leading institute across Kolkata. I also work as a web developer and designer, having worked for renowned companies and brand. Through tutorialathome, I wish to share my years of knowledge with the readers.
Enter New Comment
Comment History
No Comment Found Yet.
Leo Tolstoy
However diffcult life may seem, there is always something you can do, and succeed at. It matters that you don not just give up.
Leo Tolstoy
4212
75.03
Today So Far
Total View (Lakh)
softetechnologies
26/05/2018     52292
25/06/2018     44059
01/01/2018     42982
28/06/2017     40718
02/08/2017     39573
01/08/2017     33743
06/07/2017     33559
15/05/2017     32837
14/07/2017     29128
11/09/2018     29121
softetechnologies