freeCodeCamp/guide/russian/bootstrap/icons/index.md

3.0 KiB
Raw Blame History

title localeTitle
Icons Иконки

Иконки

Bootstrap предоставляет Glyphicons для отображения иконок. Bootstrap по умолчанию не включает библиотеку значков, но тут есть несколько рекомендаций. Хотя большинство наборов иконок включают в себя несколько форматов файлов, мы предпочитаем реализацию SVG для их улучшенной доступности и векторной поддержки.

Как пользоваться

Чтобы использовать зиконку в Bootstrap, создайте тег span с базовым классом glyphicon и отдельным классом иконок. Используйте его только для элементов, которые не содержат текстового содержимого и не имеют дочерних элементов.

Пример кода:

<span class="glyphicon glyphicon-search" aria-hidden="true"></span>

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

Структура Bootstrap предоставляет вам более 250 значков, называемых глифами. Они входят в формат шрифта из набора Glyphicon Halflings.

Как пользоваться

Чтобы использовать значки начальной загрузки, вы просто создаете <span> и применяете необходимый класс CSS для иконки. Пример кода приведен ниже.

Пример кода:

<span class="glyphicon glyphicon-search" aria-hidden="true"></span>

Список классов Glyphicon Bootstrap

Это пример классов CSS, которые bootstrap предоставляет для глификонов. Более того, они доступны здесь

.glyphicon glyphicon-plus Это значок плюса / добавления бутстрапа.

.glyphicon glyphicon-trash Это значок мусора / удаления бутстрапа.

Примечание. Не включайте точку в атрибуте класса HTML, ссылаясь на классы с точкой, используется только при настройке классов в CSS.

Иконка «Bootstrap» в кнопках


  <button type="button" class="btn btn-default" aria-label="Left Align"> 
    <span class="glyphicon glyphicon-align-left" aria-hidden="true"></span> 
  </button> 

Примечание. Значок Glyphicons Bootstrap недоступен при загрузке V4

Дополнительная информация: