时间戳

首页 > 解决方案 > Bootstrap下拉导航不下拉

html - Bootstrap下拉导航不下拉

问题描述

我正在使用 Bootstrap 类在导航栏中创建导航链接的下拉列表。但是由于某种原因，当我单击菜单图标时，没有出现下拉菜单。有人可以帮我看看我没有看到什么吗？

        <nav class="navbar navbar-light navbar-expand-sm fixed-top">
            <div class="container-fluid">
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar">
                    <span class="navbar-toggler-icon"></span>
                </button>

                    <div class="collapse navbar-collapse" id="navbar">
                        <ul class="navbar-nav mr-auto">
                            <li class="nav-item"><a class="nav-link active" href="index.html">Home</a></li>
                            <li class="nav-item"></li><a class="nav-link" href="services.html">Services</a></li>
                            <li class="nav-item"></li><a class="nav-link" href="testimonials.html">Testimonials</a></li>
                            <li class="nav-item"></li><a class="nav-link" href="blog.html">Blog</a></li>
                            <li class="nav-item"></li><a class="nav-link" href="portfolio.html">Portfolio</a></li>
                        </ul>
                        <form class="form-inline my-2 my-lg-0">
                            <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
                            <button class="btn my-2 my-sm-0" type="submit">Search</button>
                          </form>
                    </div>
            </div>
        </nav>

标签： htmlmenu

解决方案

刚刚遇到了与您类似的问题，我通过使用 bootstrap.bundle.js 而不是 bootstrap.js 解决了它。我在控制台中弹出一个错误，告诉我没有 popper.js，这是一个 boostrap 使用的库。使用 bootstrap.bundle.js 时，它与 bootstrap 捆绑在一起。

推荐阅读