Bootstrap 徽章和标签
徽章
徽章是与链接关联的项目数量的数字指示器
新闻 5评论 10
更新 2
数字 (5、10 和 2) 是徽章。
在 <span>
元素中使用 .badge
类来创建徽章
示例
<a href="#">新闻 <span class="badge">5</span></a><br>
<a href="#">评论 <span class="badge">10</span></a><br>
<a href="#">更新 <span class="badge">2</span></a>
试一试 »徽章也可以用在其他元素中,例如按钮
以下示例展示了如何在按钮中添加徽章
标签
标签用于提供有关事物的更多信息
示例 新建
示例 新建
示例 新建
示例 新建
示例 新建
示例 新建
使用 .label
类,后跟六个上下文类之一 .label-default
、.label-primary
、.label-success
、.label-info
、.label-warning
或 .label-danger
,在 <span>
元素中创建一个标签
示例
<h1>示例 <span class="label label-default">新建</span></h1>
<h2>示例 <span class="label label-default">新建</span></h2>
<h3>示例 <span class="label label-default">新建</span></h3>
<h4>示例 <span class="label label-default">新建</span></h4>
<h5>示例 <span class="label label-default">新建</span></h5>
<h6>示例 <span class="label label-default">新建</span></h6>
试一试 »以下示例展示了所有上下文标签类
默认标签 主要标签 成功标签 信息标签 警告标签 危险标签
示例
<span class="label label-default">默认标签</span>
<span class="label label-primary">主要标签</span>
<span class="label label-success">成功标签</span>
<span class="label label-info">信息标签</span>
<span class="label label-warning">警告标签</span>
<span class="label label-danger">危险标签</span>
试一试 »