bootStrap dropdown定义
时间: 2023-06-27 09:03:42 浏览: 45
Bootstrap的下拉菜单(Dropdown)是一个常用的组件,它可以让用户通过点击或鼠标悬停来打开一个菜单列表。下面是Bootstrap的下拉菜单的定义:
```html
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
下拉菜单
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<a class="dropdown-item" href="#">菜单项 1</a>
<a class="dropdown-item" href="#">菜单项 2</a>
<a class="dropdown-item" href="#">菜单项 3</a>
</div>
</div>
```
上面的代码中,`<div>` 元素包含了一个按钮和一个下拉菜单。按钮用来触发下拉菜单的显示,被标记为 `data-toggle="dropdown"`。下拉菜单本身则被包裹在一个带有 `dropdown-menu` 类的 `<div>` 元素中,并且设置了 `aria-labelledby` 属性,该属性的值为按钮的 `id` 属性值。
菜单项则通过 `<a>` 元素实现,只需要添加 `dropdown-item` 类即可。可以添加多个菜单项,将它们放在 `dropdown-menu` 元素中即可。