bootstrap汉堡包菜单与移动视图上的导航项折叠

Question

每当我单击汉堡菜单图标时，它就会随着导航项而折叠！我现在该怎么办才能解决此问题？

导航栏

<header>
        <div class="container-fluid">
            <div class="row">
                <div class="col-12 col-sm-12">
                    <nav class="navbar navbar-toggleable-md fixed-top d-flex justify-content-center">
                        <a class="navbar-brand animated  heartBeat delay-.5s" href="#home"><img class="img-fluid logo"
                                src="./Assets/Logos/LogoMakr_8A9Y2n.png" alt=""></a>
                        <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
                            data-target="#vesco-menu" aria-controls="vesco-menu" aria-expanded="false"
                            aria-label="Toggle navigation">
                            <span class="navbar-toggler-icon"><i class="fas fa-bars"
                                    style="color:#fff; font-size: 30px; "></i>
                            </span>
                        </button>
                        <div class="collapse navbar-collapse justify-content-end" id="vesco-menu">
                            <div class="navbar-nav nav nav-pills animated  fadeInRight delay-1s">
                                <a class="nav-item nav-link active" href="#home">Home <span
                                        class="sr-only">(current)</span></a>
                                <a class="nav-item nav-link" href="#project">portfolios</a>
                                <a class="nav-item nav-link" href="#skills">skills</a>
                                <a class="nav-item nav-link" id="downlink" href="./Assets/RESUME.docx"
                                    download>Resume</a>
                                <a class="nav-item nav-link" href="#testimonials">Testimonials</a>
                                <a class="nav-item nav-link" href="#contact">CONTACT ME</a>
                            </div>
                        </div>
                    </nav>
                </div>
            </div>
        </div>
    </header>

Answer 1

在我的机器上，它工作正常，我认为问题出在您的自定义CSS上，但我显示了引导程序4中不存在的一个类，因此建议您替换它。

将navbar-toggleable-md替换为navbar-expand-md