Bootstrap4 徽章（Badges）

Bootstrap4 徽章（Badges）

Bootstrap4 是一个流行的前端框架，它提供了丰富的组件和工具，帮助开发者快速构建响应式网站。徽章（Badges）是 Bootstrap4 中的一种实用组件，用于显示额外的信息或状态。本文将详细介绍 Bootstrap4 中的徽章组件，包括其用法、样式和自定义选项。

徽章的基本用法

徽章通常用于显示计数、标签或状态信息。在 Bootstrap4 中，使用徽章非常简单。以下是一个基本的徽章示例：

<span class="badge badge-primary">5</span>

这段代码将创建一个带有“5”数字的徽章，背景颜色为蓝色（primary）。徽章可以放置在任何元素中，如按钮、链接或文本。

徽章的样式

Bootstrap4 提供了多种徽章样式，包括：

• primary：蓝色
• secondary：灰色
• success：绿色
• danger：红色
• warning：橙色
• info：浅蓝色

您可以根据需要选择合适的样式。以下是一个包含不同样式的徽章示例：

<span class="badge badge-primary">5</span>
<span class="badge badge-secondary">2</span>
<span class="badge badge-success">3</span>
<span class="badge badge-danger">4</span&