Bootstrap 3: увеличить размер значка

Question

Согласно bootstrap 4, если вы используете тег заголовка для окружения пролетов, значок регулирует размер в соответствии с заголовком, как указано в документации.

<h1>Example heading <span class="badge badge-secondary">New</span></h1>

https://getbootstrap.com/docs/4.4/components/badge/

Тем не менее, у меня есть bootstrap 3, и, похоже, это поведение не поддерживается. Есть ли способ в bootstrap 3 увеличить размер значка?

Answer 1

Нет необходимости в грязных кастомах CSS. Посмотрите на .label. BS3 эквивалентен BS4

<h1>Example heading <span class="badge badge-secondary">New</span></h1>

и т. Д.

<h1>Example heading <span class="label label-default">New</span></h1>
<h2>Example heading <span class="label label-default">New</span></h2>
<h3>Example heading <span class="label label-default">New</span></h3>
<h4>Example heading <span class="label label-default">New</span></h4>
<h5>Example heading <span class="label label-default">New</span></h5>

демо -> http://jsfiddle.net/5sL7ny2w/

Answer 2

.badge-parent>span{
  font-size:3rem;
}

<h1 class="badge-parent">
  <span class="badge badge-primary">Span</span>
</h1>