简介
使用 Bootstrap，您可以创建内联标签（即 Label 和注释的文本）和徽章（即指标和未读计数）。
内联标签
通过内联标签您可以创建醒目的标签和注释文本。
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Bootstrap inline label Example</title> <meta name="description" content="Bootstrap inline label Example"> <link href="../bootstrap/twitter-bootstrap-v2/docs/assets/css/bootstrap.css" rel="stylesheet"> </head> <body> <div class="container"> <div class="row"> <div class="span12"> <p><span class="label">Default</span></p> <p><span class="label label-success">Success</span></p> <p><span class="label label-warning">Warning</span></p> <p><span class="label label-important">Important</span></p> <p><span class="label label-info">Info</span></p> <p><span class="label label-inverse">Inverse</span></p> </div> </div> </div> </body> </html>
bootstrap.css 中，从行号 3162 到行号 3200，呈现的是 label、label-success、label-warning、label-important、label-info 和 label-inverse 的样式。
徽章
就像 Bootstrap 提到的，
徽章是用于显示指标或一些分类的计数的小而简单的组件。它们通常可以在用于推送通知的电子邮件客户端比如 Mail.app 或移动 app 上找到。
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Bootstrap badges Example</title> <meta name="description" content="Bootstrap badges Example"> <link href="../bootstrap/bootstrap-2.0.3.css" rel="stylesheet"> </head> <body> <div class="container"> <div class="row"> <div class="span12"> <p><span class="badge">1</span></p> <p><span class="badge badge-success">2</span></p> <p><span class="badge badge-warning">4</span></p> <p><span class="badge badge-important">6</span></p> <p><span class="badge badge-info">8</span></p> <p><span class="badge badge-inverse">10</span></p> </div> </div> </div> </body> </html>
请注意，在该实例中，我们使用了 bootstrap-2.0.3.css，因为在 Bootstrap v2.0.1 中没有定义徽章的样式。
