Большие глификоны

Как сделать большие глификоны в twitter bootstrap 3.0 (не 2.3.x).

Этот код сделает мои глификоны большими:

<button type="button" class="btn btn-default btn-lg">
   <span class="glyphicon glyphicon-th-list">
   </span>
</button>

Как я могу получить этот размер без с помощью класса btn-lg при использовании только диапазона?

Это дает небольшой глификон:

<span class="glyphicon glyphicon-link"></span>

Ответ 1

Вы можете просто придать глифику размер шрифта по своему вкусу:

span.glyphicon-link {
    font-size: 1.2em;
}

Ответ 2

Вот как я это делаю:

<span style="font-size:1.5em;" class="glyphicon glyphicon-th-list"></span>

Это позволяет изменять размер на лету. Лучше всего подходит для специальных требований для изменения размера, а не для изменения css и его применения ко всем.

Ответ 3

Класс .btn-lg имеет следующий CSS в Bootstrap 3 (ссылка):

.btn-lg {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.33;
  border-radius: 6px;
}

Если вы применяете те же самые font-size и line-height к вашему диапазону (либо .glyphicon-link, либо вновь созданный .glyphicons-lg, если вы собираетесь использовать этот эффект более чем в одном экземпляре), вы получите Glyphicon того же размера, что и большая кнопка.

Ответ 4

<button class="btn btn-default glyphicon glyphicon-plus fa-2x" type="button">
</button>

<!--fa-2x , fa-3x , fa-4x ... -->
<button class="btn btn-default glyphicon glyphicon-plus fa-3x" type="button">
</button>

Ответ 5

В моем случае у меня был input-group-btn с button, и этот button был немного больше, чем его контейнер. Поэтому я просто дал font-size:95% для своего глификона, и он был решен.

<div class="input-group">
    <input type="text" class="form-control" id="pesquisarinbox" placeholder="Pesquisar na Caixa de Entrada">
    <div class="input-group-btn">
        <button class="btn btn-default" type="button">
            <span class="glyphicon glyphicon-search" style="font-size:95%;"></span>
        </button>
    </div>  
</div>

Ответ 6

Введите <span> в <h1> или <h2>:

<h1> <span class="glyphicon glyphicon-th-list"></span></h1>

Ответ 7

Если вы используете bootstrap 3, используйте тег, как этот <small><span class="glyphicon glyphicon-send"></span></small> Он отлично подходит для Bootstrap 3.
Вы можете даже использовать несколько тегов <small>, чтобы установить размер меньшего размера.
Код:
<small><small><span class="glyphicon glyphicon-send"></span></small></small>