Question

节日快乐！我的导航栏有问题。菜单确实崩溃了，但它没有扩展。我在Bootstrap中使用过这个例子。做了一些调整，但它没有开发。它崩溃得很好，但我不知道它为什么不扩张。

请在下面找到我的代码。谢谢！

 <body>

    <nav class="navbar navbar-expand-md navbar-dark bg-dark mb-4">
      <a class="navbar-brand" href="/">
        <img src= {% static 'img/lastlogo.png' %} width="463" height="72" class="d-inline-block align-top" alt="">
      </a>

      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>

      <div class="collapse navbar-collapse" id="navbarCollapse">
        <ul class="navbar-nav mr-auto">
          <li class="nav-item active">
            <a class="nav-link" href="/">Home <span class="sr-only">(current)</span></a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Persoane Fizice</a>
          </li>
          <li class="nav-item">
            <a class="nav-link disabled" href="#">Consultanta</a>
          </li>
             <li class="nav-item">
            <a class="nav-link disabled" href="#">Cyber Intelligence</a>
          </li>
             <li class="nav-item">
            <a class="nav-link disabled" href="#">Blog</a>
          </li>
             <li class="nav-item">
            <a class="nav-link disabled" href="#">Contact</a>
          </li>
        </ul>

      </div>
    </nav>

Answer 1

检查您的<header>并将其放入 https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js

你的代码对我有用

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>

<nav class="navbar navbar-expand-md navbar-dark bg-dark mb-4">
          <a class="navbar-brand" href="/">
            <img src= {% static 'img/lastlogo.png' %} width="463" height="72" class="d-inline-block align-top" alt="">
          </a>
    
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
    
          <div class="collapse navbar-collapse" id="navbarCollapse">
            <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                <a class="nav-link" href="/">Home <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Persoane Fizice</a>
              </li>
              <li class="nav-item">
                <a class="nav-link disabled" href="#">Consultanta</a>
              </li>
                 <li class="nav-item">
                <a class="nav-link disabled" href="#">Cyber Intelligence</a>
              </li>
                 <li class="nav-item">
                <a class="nav-link disabled" href="#">Blog</a>
              </li>
                 <li class="nav-item">
                <a class="nav-link disabled" href="#">Contact</a>
              </li>
            </ul>
    
          </div>
        </nav>

＆＃13;

详细了解如何使用navbar

Answer 2

好的，所以我不得不刷新服务器。它现在正在运作。列表中的某些项目已被禁用。我删除了它，现在正在工作。

Bootstrap Nav不会展开

2 个答案: