当前位置: 代码迷 >> 综合 >> 学习笔记8--bootstrap:布局组件之“下拉菜单”
  详细解决方案

学习笔记8--bootstrap:布局组件之“下拉菜单”

热度:0   发布时间:2023-12-09 09:06:17.0


1. 下拉菜单的 JavaScript 插件让它具有了交互性。

2. 示例:

<div class="dropdown"><button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">Dropdown<span class="caret"></span></button><ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1"><li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li><li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li><li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li><li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li></ul>
</div>

 

效果图:

具体参见:

http://v3.bootcss.com/components/#dropdowns

 

 3.禁用菜单项:

在下拉菜单的<li>元素中添加.disable类,从而禁用相应的菜单项。

如:<li role="presentation"class="disabled">

          <a role="menuitem"tabindex="-1"href="#">Disabled link</a>

     </li>