我正在尝试以这种方式使用 bootstrap 4 徽章：
<td><span class="badge badge-warning">{{ object.get_type_display }}</span></td>
我正在使用：
https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.4/css/bootstrap.min.css
可能是什么原因？
【问题讨论】：
标签： bootstrap-4 twitter-bootstrap-4
有一种将badge 与alert 类混合在一起的技巧。
示例：
<span class="badge alert-success">Active</span>
【讨论】：
删除了
.badge组件，因为它与标签/标签几乎相同。将.tag-pill修饰符与标签组件一起使用，以获得圆润的外观。
But they returned it (git issue) 所以请使用 最新 版本 - v4.0.0-alpha.6
【讨论】：
该 css 上没有徽章类。尝试另一个版本（据我所知，有 alpha.6 版本）。使用以下链接： https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css
【讨论】：
不正确：
<span class="badge badge-default badge-pill">1</span>
正确：
<span class="badge badge-secondary badge-pill">1</span>
【讨论】：
badge-warning，为什么 badge-secondary 是正确的？为什么badge-default 不正确？ （虽然我没有看到其他人在这个帖子中谈论badge-default。）
在class="badge badge-warning" 部分你可以在第二部分写class=badge alert-warning 而不是徽章关键字，它对我的代码有帮助。
【讨论】：
Walp，我看到这有点老了，但到目前为止，引导程序 4 和 5 支持徽章（与这里有人说的情况相反）......但在引导程序五中，而不是徽章次要（或信息或主要或你有什么），它是 bg-次要（或信息或主要或你有什么）。
这也是徽章背景可能不显示的（现代）原因。
【讨论】：
badge bg-secondary 在 Bootstrap 4.6.0 中为我工作
您不能使用“徽章徽章警告”。根据 Bootstrap 中的新文档，现在它就像 "badge bg-warning"
【讨论】：
badge-warning
至少在 Bootstrap 版本 5.1.x 中，徽章在 v4 中被删除后再次起作用。
您可以使用以下代码在标题旁边显示徽章：
<h1>Example heading <span class="badge bg-secondary">New</span></h1>
现在也支持按钮、背景颜色和药丸徽章。你可以在这里找到文档：https://getbootstrap.com/docs/5.1/components/badge/
【讨论】：
您的浏览器缓存是否在调试时禁用？ 这可能是原因。
我建议您使用开发人员工具来查看您的 html 输出是否也按预期呈现。
【讨论】：
这是不久前，所以它需要更新，因为我发现 alpha 6 不包含所有徽章（即徽章灯）。
今天最好使用最新的最终版本。使用此 CDN 链接进行最终发布https://www.bootstrapcdn.com/
【讨论】：