Bootstrap实现下拉菜单效果

继续修改上面的代码将Something else here行的代码进行替换

你运行之后可以查看效果，其实效果和上面的标题样式差不多，当你点击的时候会有一个禁用的图标显示。

5、基本案例

把任何按钮放入.btn-group然后加入正确的菜单标记，就可以做成下拉菜单触发器。

单按钮下拉菜单

只要改变一些基本的标记，就能把按钮变成下拉菜单开关。

分裂式按钮下拉菜单

相似地，分裂式按钮下拉菜单也需要同样的改变标记，但只要多一个分开的按钮。

只能点击小图标才能出现下来菜单额。

2）、尺寸

下拉菜单按钮适用所有尺寸的按钮。

<div class="btn-group">
<button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
Small button <span class="caret">

<div class="btn-group">
<button class="btn btn-default btn-xs dropdown-toggle" type="button" data-toggle="dropdown">
Extra small button <span class="caret">



通过样式类.btn-lg、 .btn-sm、.btn-xs来控制按钮的大小。

3）、向上弹出式菜单

给父元素添加.dropup就能使触发的下拉菜单在元素上方。



如果大家还想深入学习，可以点击进行学习，再为大家附3个精彩的专题：

本文主要介绍了下拉菜单的相关内容，然后介绍了按钮和下拉菜单的组合，变化还是蛮多的，样式也不错，希望大家喜欢。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!