Abzeichen
Abzeichen sind numerische Indikatoren, wie viele Elemente sind mit einem Link verbunden sind:
News 5Kommentare : 10
Updates 2
Die Zahlen (5, 10, und 2) sind die Abzeichen.
Verwenden Sie die .badge Klasse innerhalb <span> Elemente Abzeichen zu erstellen:
Beispiel
<a href="#">News <span class="badge">5</span></a><br>
<a href="#">Comments
<span class="badge">10</span></a><br>
<a href="#">Updates <span
class="badge">2</span></a>
Versuch es selber " Abzeichen kann auch innerhalb anderer Elemente, wie Knöpfe verwendet werden:
Das folgende Beispiel zeigt, wie Abzeichen Schaltflächen hinzufügen:
Beispiel
<button type="button" class="btn btn-primary">Primary <span
class="badge">7</span></button> Versuch es selber " Labels
Die Etiketten werden verwendet, um zusätzliche Informationen über etwas zu bieten:
Beispiel New
Beispiel New
Beispiel New
Beispiel New
Beispiel New
Beispiel New
Verwenden Sie die .label Klasse, gefolgt von einem der sechs kontextuellen Klassen .label-default , .label-primary , .label-success , .label-info , .label-warning oder .label-danger , innerhalb eines <span> Element zum erstellen eines Etiketts:
Beispiel
<h1>Example <span class="label label-default">New</span></h1>
<h2>Example <span class="label label-default">New</span></h2>
<h3>Example <span class="label label-default">New</span></h3>
<h4>Example <span class="label label-default">New</span></h4>
<h5>Example <span class="label label-default">New</span></h5>
<h6>Example <span class="label label-default">New</span></h6> Versuch es selber " Das folgende Beispiel zeigt alle kontextuellen Label-Klassen:
Beispiel
<span class="label label-default">Default
Label</span>
<span class="label label-primary">Primary
Label</span>
<span class="label label-success">Success
Label</span>
<span class="label label-info">Info Label</span>
<span class="label label-warning">Warning
Label</span>
<span class="label label-danger">Danger
Label</span> Versuch es selber " Testen Sie sich mit Übungen!
Übung 1 » Übung 2» Übung 3 » Übung 4»