Bootstrap Tutorial - Bootstrap labels

Create labels

<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
<!-- w w w.  ja  v  a  2  s.  c  o  m-->
<script src="http://java2s.com/style/jquery-1.8.0.min.js"></script>
<script src="http://java2s.com/style/bootstrap.min.js"></script>

</head>
<body style='margin: 20px;'>

  <h3>
    Example heading <span class="label label-default">New</span>
  </h3>

</body>
</html>

Click to view the demo

Available variations for labels

We can use modifier classes to change the appearance of a label.

<!DOCTYPE HTML>
<html>
<head>
<link href="http://java2s.com/style/bootstrap.min.css" rel="stylesheet">
<!--  ww w. j  ava 2 s.co  m-->

</head>
<body style='margin: 20px;'>

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

Click to view the demo