- Действие
- Другое действие
- Что-то еще здесь
-
- Отделенная ссылка
- Текст выпадающего списка
- Ссылка 1
- Ссылка 2
- Ссылка 3
Элементы меню
ul class=”dropdown-menu”>
Активный
Добавьте .active к элементам в выпадающем списке, чтобы сделать их активными. Чтобы передать активное состояние вспомогательным технологиям, используйте атрибут aria-current, используя значение page для текущей страницы или true для текущего элемента в наборе.
Отключенный
Добавьте .disabled к элементам в выпадающем списке, чтобы сделать их отключенными.
Выравнивание меню
По умолчанию раскрывающееся меню автоматически располагается на 100% сверху и слева от своего родителя. Вы можете изменить это с помощью направленных классов .drop*, но Вы также можете управлять ими с помощью дополнительных классов-модификаторов.
Добавьте .dropdown-menu-end в .dropdown-menu, чтобы выровнять раскрывающееся меню по правому краю. При использовании Bootstrap в RTL направления отражаются, то есть .dropdown-menu-end появится слева.
Внимание! Выпадающие списки позиционируются благодаря Popper, за исключением случаев, когда они содержатся в навигационной панели.
Текст
Поместите произвольный текст в выпадающее меню с текстом и используйте утилиты отступов. Обратите внимание, что Вам, вероятно, потребуются дополнительные стили размеров, чтобы ограничить ширину меню.
Параметры выпадающего списка
Используйте data-bs-offset или data-bs-reference, чтобы изменить расположение выпадающего списка.
Поведение автоматического закрытия
По умолчанию раскрывающееся меню закрывается при нажатии внутри или вне раскрывающегося меню. Вы можете использовать опцию autoClose, чтобы изменить поведение раскрывающегося списка.