為什么我的引導折疊導航欄不起作用

Question

所以我嘗試使用引導程序創建一些導航欄並使其能夠折疊但它不起作用請幫忙

這是我的代碼行：

<nav class="navbar navbar-expand-md navbar-light bg-light sticky-top">
      <div class="container-fluid">
        <a class="navbar-brand" href="index.html"><img src="img/logo.png" alt="WebLogo"></a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive">
          <span class="navbar-toggler-icon"></span>
        </button> 
 
        <div class="collapse navbar-collapse justify-content-end" id="navbarResponsive">
          <ul class="navbar-nav mr-auto">
            <li class="nav-item active">
              <a class="nav-link" href="#" data-toggle="collapse" data-target=".navbar-collapse.show">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Service</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Team</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Location</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Connect</a>
            </li>
            <li class="nav-item">
              <button type="button" class="btn btn-outline-secondary">Sign in</button>
            </li>
          </ul>
        </div>
      </div>
    </nav>

感謝它的幫助，謝謝

Answer 1

您必須將 jQuery 和 popper.js 鏈接或文件添加到您的項目中

jQuery

 <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
crossorigin="anonymous"></script>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx"
crossorigin="anonymous"></script>

訪問引導文檔