Bootstrap 5 Dropdowns
Add dropdown menus without writing any JavaScript.
Bootstrap includes a component for adding dropdown menus. The JavaScript is included with the default Bootstrap JS file and you can use it simply by adding the CSS classes — no further JavaScript required.
Example
Here's an example of a Bootstrap 5 dropdown:
Dropup Menu
You can reverse the dropdown so that it becomes a "dropup" menu.
To do this, use .dropup instead of .dropdown on the parent element.
Align Right
You can add Bootstrap's .dropdown-menu-end class to the .dropdown-menu class to align the menu to the right of its parent.
Menu Headers
Add a header to your dropdown menu by adding a applying Bootstrap's .dropdown-header class to a heading element (<h1> - <h6>).
Dividers
Add dividers to your dropdown menu by adding a applying Bootstrap's .dropdown-divider class to an <hr> element.
Disabled Menu Items
Disable a menu item by applying Bootstrap's .disabled class.
Split Dropdowns
You can also create split dropdown menus with button groups.
More on Dropdowns
See the Bootstrap documentation for more on dropdowns.