Bootstrap5徽章组件：简洁标签与状态标识

Bootstrap5的徽章组件是网页设计中标识内容状态、分类或提示的实用工具，体积小、样式统一，支持多色和多尺寸。使用时需先引入Bootstrap5 CSS，基础用法为`<span class="badge bg-*">内容</span>`，如`bg-primary`（蓝色）、`bg-success`（绿色）等。 它支持多种样式：颜色变体通过`bg-*`类实现（如红、黄、灰等）；大小调整用`badge-sm`（小号）、`badge-lg`（大号）；药丸形状（`badge-pill`）更醒目，适合通知数量等场景。 常见场景包括：通知数量提示（如按钮旁红色小圆点数字）、分类标签（商品“热门”“新品”）、导航栏未读提示及列表项状态标记。使用时需注意语义化（用`<span>`）、颜色对比、避免过度使用，保持信息简洁直观。