Bootstrap 标签

Bootstrap 标签（Badge）是一种小巧的组件，用于显示计数、提示或标识信息。在 Bootstrap 中，可以通过添加 .badge 类到 <span> 元素上来创建标签。例如，<span class="badge">4</span> 将创建一个包含数字 4 的标签。

Bootstrap 提供了多种预定义的样式，可以轻松改变标签的外观。以下是一些常用的样式：

• .badge-primary：蓝色背景
• .badge-secondary：灰色背景
• .badge-success：绿色背景
• .badge-danger：红色背景
• .badge-warning：黄色背景
• .badge-info：浅蓝色背景
• .badge-light：浅灰色背景
• .badge-dark：深灰色背景

你可以将这些类添加到 .badge 类中，以改变标签的颜色。例如，<span class="badge badge-primary">新</span> 将创建一个带有“新”文字的蓝色标签。

在 Bootstrap 中，标签通常用于与按钮或其他元素结合使用。你可以将标签放置在按钮的内部或旁边，以显示相关的信息。例如：

<button type="button" class="btn btn-primary">
消息 <span class="badge badge-light">4</span>
</button>

这个示例将创建一个按钮，其中包含一个带有数字 4 的浅灰色标签，用于显示消息的计数【10†source】【11†source】【13†source】。