Перейти к основному содержанию Перейти к навигации по документам

Разметка

Освойте основные классы используемые в верстке при помощи bootstrap 5: контейнеры, систему сеток (grid), css сетку, колонки, контрольные точки, отступы, z-index и утилиты макета.

Содержание

Контейнеры

Контейнеры являются фундаментальным строительным блоком Bootstrap, которые содержат ваш контент, дополняют и выравнивают его на устройствах или в областях просмотра.

Система сеток

Используйте мощную мобильную сетку flexbox для создания макетов всех форм и размеров. Используется система «12 колонок», 5-ти адаптивных ярусов, препроцессоров Sass и предустановленных классов.

Колонки

Узнайте, как благодаря нашей системе сеток flexbox изменять столбцы с помощью нескольких опций выравнивания, упорядочивания и смещения. Также смотрите как использовать классы столбцов для управления шириной элементов не связанных с сеткой.

Контрольные точки

Контрольные точки (Breakpoints) - это триггеры настраиваемой ширины, которые определяют поведение адаптивного макета Bootstrap в зависимости от размеров устройства или области просмотра.

Отступы

Отступы между столбцами используются для гибкого размещения и выравнивания содержимого в системе сеток Bootstrap.

Утилиты для макета

Для более быстрой и гибкой разработки, в том числе для мобильных устройств, Bootstrap включает в себя десятки служебных классов для отображения, скрытия, выравнивания и размещения содержимого.

Z-index

Хотя z-индексы не являются частью системы сеток Bootstrap, но они играют важную роль в том, как наши компоненты накладываются и взаимодействуют друг с другом.

CSS-сетка

Использование и настройка нашей альтернативной системы макета, основанной на CSS Grid, с примерами и фрагментами кода.

Помочь проекту