css - 菜单下的子菜单不显示

标签 css twitter-bootstrap

我有四个菜单,其中一个菜单有 2 个子菜单,我为此使用了 bootstrap,但经过多次尝试,我没有找到任何方法来解决它,因为我是新手。单击主菜单时不显示子菜单。

我尝试了各种可能的方法,当我将 CDN 添加到我的元素中时,它工作正常。但是当我从本地存储添加 Bootstrap 文件时,它没有显示。但其他功能运行良好

<link rel="stylesheet" href="css/bootstrap.css">
<style>
    .header {
        height: 50px;
        background-color: black;
        margin-top: 3px;
    }

    .column {
        margin-left: 100px;
    }
</style>
<body>
    <nav class="navbar navbar-expand-sm  navbar-dark bg-dark header">
        <a href="#" class="navbar-brand">Stone</a>
        <ul class="nav navbar-nav column">
            <li class="nav-item"><a href="#" class="nav-link">Home</a></li>
            <li class="nav-item"><a href="#" class="nav-link">Add Employee</a></li>

            <li class="nav-item dropdown">
                <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" id="searchEmp" role="button">Search Employee</a>
                <div class="dropdown-menu" aria-labelledby="searchEmp">
                    <a href="#" class="dropdown-item">Search With ID</a>
                    <a href="#" class="dropdown-item">Search All Employee</a>
                </div>
            </li>
            <li class="nav-item"><a href="#" class="nav-link">About</a></li>
        </ul>
    </nav>

    <script src="js/bootstrap.js"></script>
    <script src="js/jquery-3.4.1.js"></script>
</body>

在控制台中没有显示任何错误

最佳答案

Bootstrap 的 Javascript 依赖于 jQuery。这意味着为了使其正常工作,需要首先加载 jQuery。如果您切换以下几行,它应该可以工作。

<script src="js/bootstrap.js"></script>
<script src="js/jquery-3.4.1.js"></script>

关于css - 菜单下的子菜单不显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56348705/

相关文章:

html - Mobile Safari/Safari 固定位置不重绘

html - 缩放父元素但移除子元素的缩放

java - Bootstrap Popover 的 Selenium ElementNotVisibleException

javascript - 处于 Bootstrap 模式时 Ckeditor 错误

javascript - 打开关闭按钮功能 Bootstrap

javascript - 无法根据下拉选择在 AJAX/Javascript/HTML 中创建表单

html - Bootstrap 4 : HTML - Using a Div with the Navbar

javascript - 动态设置div的位置

css - 如何摆脱我在 Bootstrap 中的下拉列表之间的空间

javascript - 垂直 Bootstrap 旋转木马箭头和导航列表