Basic Dropdown

Use the dropdown , dropdown-toggle and dropdown-menu classes to create a basic dropdown.

Dropdown

Dropdown Button

Use btn btn-{color} with the dropdown-toggle class to create a dropdown button.

Outlined Dropdown Button

Use btn btn-outline-{color} with the dropdown-toggle class to create a dropdown button.

Split Dropdown

You can create a split dropdown button with the btn-group class.

Dropdown Size

You can create a small, medium, large or extra large dropdown button. Just add the btn-xs , btn-sm , btn-md , btn-lg or btn-xl along with the btn class.

Dropdown Position

You can create a dropdown button with different position. Just add the data-placement attribute with the dropdown class. The available placements are top , top-start , top-end , bottom , bottom-start , bottom-end , left , left-start , left-end , right , right-start and right-end .