Anniversary Labels

Labels

Example

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New

Example heading New

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

Available variations

Add any of the below mentioned modifier classes to change the appearance of a label.

Default

Primary

Success

Info

Warning

Danger

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

Have tons of labels?

Rendering problems can arise when you have dozens of inline labels within a narrow container, each containing its own inline-block element (like an icon). The way around this is setting display: inline-block;.