Bootstrap Label

Bootstrap label class used for Labels. We use the label for highlight to any word. Some time we use the label for indicate the headings. Many types of labels like Default Label, Primary Label, Info Label, Success Label, Warning Label, Danger Label.

Success always indicate with green color, Danger always indicate with red color, Default always indicate with grey color, that’s why all labels show with different background colors.

Example:

<!DOCTYPE html>
<html>
<head>
<meta charset=“utf-8”>
<meta name=“viewport” content=“width=device-width, initial-scale=1”>

<!–Bootstrap CSS File–>
<link rel=“stylesheet” href=“https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css”>
<link rel=“stylesheet” href=“https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css”>
</head>

<body>

<div class=“container”>
<h1> Bootstrap Label </h1>
<label class = “label label-default”> Default Label </label>
<label class = “label label-info”> Info Label </label>
<label class = “label label-primary”> Primary Label </label>
<label class = “label label-success”> Success Label </label>
<label class = “label label-warning”> Warning Label </label>
<label class = “label label-danger”> Danger Label </label>

</div>

<!– End Container –>

<!– Bootstrap js file –>
<script src=“https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js”></script>
<script src=“https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js”></script>
</body>

</html>

RESULT:

bootstrap-label


Leave a Reply

avatar
  Subscribe  
Notify of