按钮下拉菜单html,Bootstrap CSS组件之按钮下拉菜单

按钮下拉菜单

结合使用.btn-group(btn-group-lg/btn-group-sm/btn-group-xs) .dropup .btn .dropdown-menu

按钮下拉菜单是在普通的下拉菜单的基础上封装了.btn样式得效果，就类似于单击一个button按钮，然后显示隐藏的下拉菜单。

组合式下拉菜单

分离式下拉菜单

向上弹起的下拉菜单

//源码，css实现方式主要是设置.dropdown-menu样式容器的bottom为100%

.dropup .dropdown-menu,

.navbar-fixed-bottom .dropdown .dropdown-menu {

top: auto;//高度自适应

bottom: 100%;//距离dropup样式得元素底部100%的宽度，即靠着上边框，向上方向弹出

margin-bottom: 2px;

}

Bootstrap 101 Template

Success

• HTML
• CSS
• JS

Button

• HTML
• JS
• CSS

Button

• HTML
• JS
• CSS

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。