Bootstrap系列 -- 26. 下拉菜单标题
2015-06-25 22:28
645 查看
Bootstrap下拉菜单中使用 dropdown-header 来显示菜单标题,和上一篇说道的分割线一样
<div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown"> 下拉菜单 <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1"> <li role="presentation" class="dropdown-header">第一部分菜单头部</li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">下拉菜单项</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">下拉菜单项</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">下拉菜单项</a></li> <li role="presentation" class="divider"></li> <li role="presentation" class="dropdown-header">第二部分菜单头部</li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">下拉菜单项</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">下拉菜单项</a></li> <li role="presentation"><a role="menuitem" tabindex="-1" href="#">下拉菜单项</a></li> </ul> </div> <div class="dropdown"> <button class="btn btn-info dropdown-toggle" data-toggle="dropdown"> 选择运动 </button> <ul class="dropdown-menu"> <li class="dropdown-header">第一部分标题</li> <li><a href="javascript:void(0)">足球</a></li> <li><a href="javascript:void(0)">篮球</a></li> <li><a href="javascript:void(0)">乒乓球</a></li> <li class="divider"></li> <li class="dropdown-header">蔬菜</li> <li><a href="javascript:void(0)">足球</a></li> <li><a href="javascript:void(0)">篮球</a></li> <li><a href="javascript:void(0)">乒乓球</a></li> </ul> </div>
相关文章推荐
- Bootstrap系列 -- 25. 下拉菜单分割线
- Bootstrap系列 -- 24. 下拉菜单基本用法
- Bootstrap系列 -- 23. 图片
- Bootstrap系列 -- 22. 按钮详解
- Bootstrap系列 -- 22. 按钮
- 利用bootstrap中tooltip的使用,弹出微信二维码
- bootstrap 禁用 modal 点击空白处关闭事件
- Bootstrap系列 -- 21. 表单提示信息
- 《Bootstrap实战》
- Bootstrap系列 -- 20. 禁用状态
- Bootstrap系列 -- 19. 焦点状态
- Bootstrap系列 -- 18. 表单控件大小
- Bootstrap-Datatable学习笔记整理第1节
- Bootstrap系列 -- 17. 复选框checkbox和单选择按钮radio
- Bootstrap系列 -- 16. 文本域textarea
- bootstrap小技巧
- Bootstrap系列 -- 15. 下拉选择框select
- Bootstrap系列 -- 14. 表单控件输入框input
- Bootstrap系列 -- 13. 内联表单
- Bootstrap系列 -- 12. 水平表单