バッジ
バッジは、リンクに関連付けられているどのように多くの項目の数値指標であります:
ニュース5コメント10
アップデート2
番号(5、10、および2)はバッジです。
使用.badge
内のクラスを<span>
バッジを作成するための要素:
例
<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>
»それを自分で試してみてください :バッジは、ボタンなどの他の要素の内部にも使用することができます
次の例では、ボタンにバッジが追加する方法を示しています。
例
<button type="button" class="btn btn-primary">Primary <span
class="badge">7</span></button>
»それを自分で試してみてください ラベル
ラベルは何かについての追加情報を提供するために使用されています。
例新しいです
例新しいです
例新しいです
例新しいです
例新しいです
例新しいです
使用.label
6文脈クラスのいずれかに続いて、クラス、 .label-default
、 .label-primary
、 .label-success
、 .label-info
、 .label-warning
または.label-danger
内に、 <span>
要素ラベルを作成します。
例
<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>
»それを自分で試してみてください 次の例では、すべてのコンテキストラベルクラスを示しています。
デフォルトのラベル プライマリラベル の成功のラベル 情報ラベル 警告ラベル 危険ラベル
例
<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>
»それを自分で試してみてください