Bootstrap 5 Группа списка Активные элементы

Bootstrap 5 предоставляет активную функцию List Group, в которой элементы хранятся в виде списка. Группы списков — это гибкий и мощный компонент для отображения серии контента. Функция List Group Active используется для указания текущего активного выбора.

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

• .active: этот класс используется для указания текущего активного выбора.
• .list-group-item: этот класс используется для указания и добавления элементов в список.
• .list-group: этот класс используется для создания списка Bootstrap.

Синтаксис:

<ul class="list-group">
       <li class="list-group-item active">...</li>
    <li class="list-group-item">...</li> 
    ...
</ul>

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

Выход:

Пример 2. Следующий код демонстрирует активные элементы группы списка для нескольких элементов.

Выход:

Ссылка: https://getbootstrap.com/docs/5.0/components/list-group/#active-items