Dropdowns are toggleable overlays for displaying lists of links:

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown">
    Dropdown button
  </button>
  <ul class="dropdown-menu">
    <li><a class="dropdown-item" href="#">Action</a></li>
    <li><a class="dropdown-item" href="#">Another action</a></li>
    <li><hr class="dropdown-divider"></li>
    <li><a class="dropdown-item" href="#">Separated link</a></li>
  </ul>
</div>

Dropdown variations:

• dropup, dropend, dropstart: Direction modifiers
• dropdown-menu-end: Right-aligned menu
• dropdown-item-text: Non-interactive text
• dropdown-header: Section headers