Dropdown
Basic Dropdown
Use the
dropdown
,
dropdown-toggle
and
dropdown-content
classes to create a basic 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
.
