Bootstrap 5 Сеточная система Равная ширина

Опубликовано: 18 Февраля, 2023

Система Bootstrap 5 Grid — это мощная адаптивная flexboxgrid для мобильных устройств, которая позволяет размещать до 12 столбцов на странице. Вы также можете сгруппировать столбцы вместе.

Система сетки равной ширины в основном используется для создания сетки одинакового размера. С помощью классов мы будем управлять шириной сетки.

Система сетки Используемые классы равной ширины:

  • .row: этот класс используется для создания сетки строк и используется в родительском классе для создания системы сетки одинаковой ширины.
  • .col: этот класс используется для создания сетки/столбца, и этот класс используется внутри класса .row.

Примечание: вы также можете использовать другой класс начальной загрузки, такой как класс границы, для создания границы классов сетки и цвета текста.

Синтаксис:

 <div class="row">
     <div class="col">
         ...
     </div>
     ...
 </div>

Пример 1. В этом примере мы будем использовать классы .row и .col для создания двух сеток одинаковой ширины.

Выход:

Пример 2. В этом примере мы будем использовать классы .row и .col для создания разных сеток разной одинаковой ширины.

Выход:

Ссылка: https://getbootstrap.com/docs/4.0/layout/grid/#equal-width