Dropdowns
Single Button Dropdown
Use btn
class at to create a dropdown
toggle with <button> element.
Dropdown Color Variant
Use btn-
class with below mentioned variation to color dropdown toggle.
Split Button Dropdown
Use dropdown-toggle-split
to create split button dropdowns as a single button dropdown.
Dropdown Sizing
Use btn-lg
class to create a large size dropdown button and btn-sm
to create a small size dropdown button.
Dark Dropdowns
Use dropdown-menu-dark
class onto an existing dropdown-menu to create dropdown items dark.
Alignment options
Dropdown demo with various dropdown alignment
options.
Dropdown Options
Use data-bs-offset
or
data-bs-reference
to change the position of the dropdown.
Auto Close Behavior
By default, the dropdown menu is closed when clicking inside or outside the dropdown menu. You can use the autoClose
option to change this behavior of the dropdown.
Dropdown Menu Item Color
Example of dropdown menu and dropdown item color.
Dropdown Menu Success link example
Dropdown Menu link Color example
Dropdown menu Primary link
Dropdown menu Secondary link
Dropdown menu Success link
Dropdown menu Warning link
Dropdown menu Info link
Dropdown menu Danger link
Menu Content
Example of dropdown menu containing
Headers, Text and Forms
content.