Утилиты для макета
Для более быстрой и гибкой разработки, в том числе для мобильных устройств, Bootstrap включает в себя десятки служебных классов для отображения, скрытия, выравнивания и размещения содержимого.
Изменение параметра display
Используйте отображение элементов для быстрого переключения общих значений свойства отображения display
. Пользуйтесь этим свойством при использовании нашей сеточной системы и компонентов, чтобы показать или скрыть их на разных зонах видимости.
Параметры адаптивных flexbox-контейнеров
Bootstrap создан с использованием flexbox, но не у каждого элемента свойство display
изменено на display: flex
поскольку это могло бы вызвать множество ненужных переназначений переменных и непредвиденные проблемы поведения браузеров. Но большинство наших компонентов имеет такое свойство.
Если вам понадобится добавить свойство display: flex
к элементу, добавьте в него класс .d-flex
или один из «отзывчивых» вариантов (.d-sm-flex
). Вам понадобится этот класс или значение display
для «включения в строй» наших дополнительных флексбокс-утилит для настройки размеров, отступов и т.п.
Поля и отступы
Используйте утилиты отступа margin
и padding
для контроля размера и отступов элементов. Bootstrap имеет шестиуровневую шкалу для интервалов между утилитами, основанную на переменной $spacer
со значением по умолчанию, равному 1rem
. Выберите значения для всех окон просмотра (например, .me-3
для margin-right: 1rem
в LTR)или выберите адаптивные варианты для нацеливания на определенные области просмотра (например, .me-md-3
для margin-right: 1rem
- в LTR - начиная с контрольной точки md
).
Переключение видимости visibility
Когда переключение display
не требуется, Вы можете переключать visibility
элемента с помощью наших утилит видимости. Невидимые элементы по-прежнему будут влиять на макет страницы, но визуально скрыты от пользователей.