css - bootstrap dropdown 下拉菜单无法收缩,怎么解决？

问题描述

问 题

使用bootstrape 插入下拉菜单无法收缩回去，如图所示:

html代码如下，bootstrap csc,js 库和jQuery的库都已经正确的引用

    <div class="dropdown">
         <button type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">
        <div><img src="img/avatar-small.jpg"/></div>
        <span class="caret"></span>
        </button>
         <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
        <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>

解决方案

你的html里只有bootstrap和jquery?

曾经遇到过失效的问题，最终发现是因为别的js库依赖了bootstrap，但是版本比较老，导致了失效。

然后，还要注意引入的顺序，要先引入jQuery，再bootstrap。

这篇关于css - bootstrap dropdown 下拉菜单无法收缩,怎么解决？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！