Bootstrap下拉菜单


Bootstrap提供Dropdown作为显示链接列表的插件。 下拉列表是一个切换按钮，显示链接列表。

Bootstrap的下拉菜单设计为通用的，适用于各种情况。例如，可以创建包含搜索字段或登录表单的下拉列表。

例

<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>

示例说明

.dropdown类表示下拉菜单。

要打开下拉菜单，请使用按钮或带有.dropdown-toggle类和data-toggle =dropdown属性的链接。

.caret类创建一个插入箭头图标，表示该按钮是一个下拉列表。

将.dropdown-menu类添加到无序列表元素以实际构建下拉菜单。

更多BootStrap教程

学习更多BootStrap教程