39 lines
1.2 KiB
Markdown
39 lines
1.2 KiB
Markdown
---
|
||
title: Dropdowns
|
||
localeTitle: 下拉菜单
|
||
---
|
||
## 下拉菜单
|
||
|
||
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">
|
||
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_类添加到无序列表元素以实际构建下拉菜单。
|
||
|
||
#### 更多信息：
|
||
|
||
https://getbootstrap.com/docs/4.0/components/dropdowns/ |