The .dropdown class is used to indicate a dropdown menu.
Use the .dropdown-menu class to actually build the dropdown menu.
To open the dropdown menu, use a button or a link with a class of .dropdown-toggle and data-toggle="dropdown".
The .dropdown-divider class is used to separate links inside the dropdown menu with a thin horizontal line:
The .dropdown-header class is used to add headers inside the dropdown menu:
The .active class adds a blue background color to the active link.
The .disabled class disables a dropdown item (grey text color and a no-parking-sign on hover).
Add the .dropright class next to the dropdown menu to right-align the dropdown. Note that the caret/arrows is added automatically:
Add the .dropleft class next to the dropdown menu to left-align the dropdown. Note that the caret/arrow is added automatically. Also note that we float the dropdown to the right:
Add the .dropdown-menu-right class to .dropdown-menu to right-align the dropdown menu.
The .dropup class makes the dropdown menu expand upwards instead of downwards:
The .dropdown-item-text class is used to add plain text to a dropdown, or used on links for default link styling.
Nest button groups to create dropdown menus: