7-boostrap笔记-下拉菜单

除了使用select标签创建一个人下拉菜单，还可以使用一个按钮加ul标签的形式创建一个下拉菜单，效果比select标签更加可观

<div class="dropdown">
    <div class="btn-group">
        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
            下拉菜单
            <span class="caret"></span>
        </button>
        <ul class="dropdown-menu" role="menu">
            <li><a href="#">点我</a></li>
            <li><a href="#">点我</a></li>
        </ul>
    </div>
</div>

• 当然要使用下拉列表，要引入bootstrap.min.js，并且在此之前要引入jquery
• 当我们想要让menu菜单在右边出现的时候，这时候只需要在ul标签上加上dropdown-menu-right
• 并且在 drowdown这一层加上pull-right

<!--当我们想要将下拉列表分成两列的时候，这时候只需要在ul标签中加一列即可-->
<li href="#" role="presentation" class="dropdown=header">请点击某个选项</li>
<!--如果想改成一更横线来分割这个下拉列表，那么只需要加这个下拉列表即可-->
<li role="presentation" class="divider"></li>

<!--在li标签中添加class="disabled"可以将下拉菜单变成不可选状态-->
<li class="disabled">...</li>