导航栏不会打开

Question

我正在使用免费模板，并且发现Bootstrap非常适合使用。但是我的问题是切换菜单无法打开。当您使用较小的屏幕设备时，它会隐藏链接。 但是我的问题是，单击汉堡包菜单不会打开。 还有一种在较小的设备上不隐藏所有链接的方法， 我的菜单代码是

        <!-- Nested Container Starts -->
    <div class="container pl-sm-0 pr-sm-0">
    <!-- Main Menu Starts -->
        <nav id="nav" class="main-menu one navbar navbar-expand-md pr-sm-0 pr-lg-3 pr-xl-0">
        <!-- Nested Container Starts -->
            <div class="container-fluid pr-sm-0">
            <!-- Navbar Toggler Starts -->
                <button class="navbar-toggler ml-auto" type="button" data-toggle="collapse" data-target=".navbar-cat-collapse" aria-controls=".navbar-cat-collapse" aria-expanded="false" aria-badge="Toggle navigation">
                    <span class="navbar-toggler-icon fa fa-bars"></span>
                </button>
            <!-- Navbar Toggler Ends -->
            <!-- Navbar Cat collapse Starts -->
                <div class="collapse navbar-collapse navbar-cat-collapse animation">
                <!-- Nav Links Starts -->
                    <ul class="nav navbar-nav text-weight-bold custom-center ">
                        <li class="nav-item active dropdown">
                        <li class="nav-item" style="padding-left: 10px;"><a href="index.php" class="nav-link dropdown-toggle" data-toggle="dropdown">Home </i></a>
                        <li class="nav-item" style="padding-left: 10px;"><a href="about.php" class="nav-link">About Us</a></li>
                        <li class="nav-item dropdown" style="padding-left: 10px;">
                        <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Services <i class="fa fa-angle-down">      
                        </a></i>
                        <div class="dropdown-menu rounded-0">
                            <a class="dropdown-item" href="business_growth.php">Business Growth</a>
                            <a class="dropdown-item" href="product_solutions.php">Product Solutions</a>
                            <a class="dropdown-item" href="transitition_services.php">Transitition Services</a>
                        </div>
                      </li>
                        <li class="nav-item" style="padding-left: 10px;"><a href="team_profiles.php" class="nav-link">Team Profiles</a></li>
                        <li class="nav-item" style="padding-left: 10px;"><a href="resources.php" class="nav-link">Resources</a></li>
                        <li class="nav-item" style="padding-left: 10px;"><a href="contact.php" class="nav-link">Contact Us</a></li>       
                    </ul>
                <!-- Nav Links Ends -->
                <!-- Call Back Starts -->
                    <h6 class="ml-auto d-xs-none d-sm-none d-xl-block text-uppercase animation">
                        <a href="#">Get A Call Back</a>
                    </h6>
                <!-- Call Back Ends -->
                </div>
            <!-- Navbar Cat collapse Ends -->
            </div>
        <!-- Nested Container Ends -->
        </nav>
    <!-- Main Menu Ends -->
    </div>
<!-- Nested Container Ends -->