Панель инструментов Bootstrap 5 Button Group Buttons

Компоненты панели кнопок группы кнопок используются для создания панели инструментов групп кнопок. Он объединяет наборы кнопок в группу кнопочных панелей инструментов для сложных компонентов.

Предварительное условие: Bootstrap 5 Button Group для создания группы кнопок.

Панель инструментов группы кнопок Класс:

• btn-toolbar: этот класс используется для придания группе кнопок вида панели инструментов.

Синтаксис:

<div class="btn-toolbar" >
  <div class="btn-group ..." >
    <button type="button" class="...">....</button>
    ....
  </div>

Пример ниже иллюстрирует панель инструментов кнопок группы кнопок:

Пример 1: В этом примере мы создадим единую панель инструментов группы кнопок. Мы использовали границу, чтобы вы могли различать кнопки.

Выход:

Пример 2: В этом примере мы создадим несколько панелей инструментов группы кнопок. Мы использовали цвета фона и цвета границ на панели инструментов другой группы кнопок, чтобы вы могли различать кнопки.

Выход:

Ссылка: https://getbootstrap.com/docs/5.0/components/button-group/#button-toolbar