如何在 bootstrap 4 中增加徽章大小/字体大小？

Question

如何在 bootstrap 4 中增加徽章大小？

我试图放入标题 ( <h3></h3>) 块，但这将显示更改为block，这不是我需要的（我想标题应该保留给...标题）。

Answer 1

将徽章放在标题元素内，在带有 class 的元素内lead，或者在自定义样式表或嵌入样式元素中创建您自己的大小调整类：

body {
  padding: 20px;
}

.badge.even-larger-badge {
  font-size: 1.1em;
}

<link rel="stylesheet"
 href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" />

<h2><span class="badge badge-primary">Heading 2</span></h2>
<h3><span class="badge badge-primary">Heading 3</span></h3>

<p>
  <span class="badge badge-primary">Regular</span>
  <span class="lead"><span class="badge badge-secondary">Lead</span></span>
  <span class="badge badge-primary even-larger-badge">Custom</span>
</p>