1.4 KiB
1.4 KiB
| title | localeTitle |
|---|---|
| Dropdowns | Dropdowns |
Dropdowns
O Bootstrap fornece Dropdowns como um plugin para exibir listas de links. O menu suspenso é um botão que alterna a exibição de uma lista de links.
Os menus suspensos do Bootstrap são projetados para serem genéricos e aplicáveis a uma variedade de situações. Por exemplo, é possível criar menus suspensos que contenham campos de pesquisa ou formulários de login.
Exemplo
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropdown example
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</div>
Exemplo explicado
A classe .dropdown indica um menu suspenso.
Para abrir o menu suspenso, use um botão ou um link com uma classe de .dropdown-toggle e o atributo data-toggle = "dropdown .
A classe .caret cria um ícone de seta de cursor (▼), que indica que o botão é um menu suspenso.
Adicione a classe .dropdown-menu a um elemento de lista não ordenada para realmente criar o menu suspenso.