Больше Технологии Glyphicons
Как сделать больше технологии glyphicons в Twitter начальной загрузки 3.0 (не 2.3.икс.)
этот код будет делать мой технологии glyphicons большой:
<button type="button" class="btn btn-default btn-lg">
<span class="glyphicon glyphicon-th-list">
</span>
</button>
Как я могу получить этот размер без использование класса btn-lg при использовании только пролет ?
это дает небольшой glyphicon:
<span class="glyphicon glyphicon-link"></span>
7 ответов:
вы можете просто дать glyphicon размер шрифта по своему вкусу:
span.glyphicon-link { font-size: 1.2em; }
вот как я делаю это:
<span style="font-size:1.5em;" class="glyphicon glyphicon-th-list"></span>
Это позволяет изменять размер на лету. Лучше всего подходит для специальных требований по изменению размера, а не для изменения css и его применения ко всем.
The
.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 такого же размера, как большие кнопки.
<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>
в моем случае, у меня было
input-group-btn
Сbutton
, а этоbutton
немного больше, чем его контейнер. Так что я просто далfont-size:95%
для моего glyphicon и она была решена.<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>
Если вы используете bootstrap 3, используйте тег, как это
<small><span class="glyphicon glyphicon-send"></span></small>
Он отлично работает для Bootstrap 3.
Вы даже можете использовать несколько<small>
теги, чтобы установить размер еще меньше.
Код:<small><small><span class="glyphicon glyphicon-send"></span></small></small>