Bootstrap: Labels and Badges

Labels

We use BLabel instead of Label so as to differentiate Bootstrap decorated labels from the native form element of the same name.

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New
Example heading New
<h1>Example heading <BLabel>New</BLabel></h1>
<h2>Example heading <BLabel>New</BLabel></h2>
<h3>Example heading <BLabel>New</BLabel></h3>
<h4>Example heading <BLabel>New</BLabel></h4>
<h5>Example heading <BLabel>New</BLabel></h5>
<h6>Example heading <BLabel>New</BLabel></h6>

Variations

For more colors consult the colors.scss file.

Default Primary Success Info Warning Danger
<BLabel bsStyle='default'>Default</BLabel>{' '}
<BLabel bsStyle='primary'>Primary</BLabel>{' '}
<BLabel bsStyle='success'>Success</BLabel>{' '}
<BLabel bsStyle='info'>Info</BLabel>{' '}
<BLabel bsStyle='warning'>Warning</BLabel>{' '}
<BLabel bsStyle='danger'>Danger</BLabel>

Badges

Easily highlight new or unread items by adding a Badge to links

<a href='#'>Inbox <Badge>42</Badge></a>