Bootstrap 5 Кнопки Кнопки блокировки

Кнопки Bootstrap 5 Block используются для отображения полноразмерных адаптивных кнопок. Чтобы сделать блочные кнопки, мы будем использовать классы .d-grid и .d-flex. Мы также можем использовать классы размеров экрана для изменения размеров кнопок на разных размерах экрана.

Используемые кнопки блоков Классы:

• .d-flex: этот класс используется для отображения элемента в виде гибкого контейнера блочного уровня.
• .d-block: этот класс используется для отображения элемента как элемента уровня блока (например, <p>).

Синтаксис:

<div class="d-grid gap-*">
      <button class="btn btn-*" type="button">
          Button
      </button>
      ...
</div>

Пример 1: В этом примере показана работа кнопки уровня блока в Bootstrap 5.

Выход:

Пример 2: В этом примере показана работа кнопки уровня блока в Bootstrap 5.

Выход:

Ссылка: https://getbootstrap.com/docs/5.0/components/buttons/#block-buttons