Question

我使用引导程序4设计了一个导航栏，所有链接都可以移至左侧并正确使用Ml和MR auto，我想要的是我创建的链接均匀分布在导航栏上可以实现这一目标，谢谢。我的代码如下。

   <div class="container">
              <h1 class="text-muted"> Jumia Sale Page</h1>
              <nav class="navbar navbar-expand-lg ">
                  <button class="navbar-toggler " data-toggle="collapse" data-target="#navbarcollapse">
                      <span class="navbar-toggler-icon" ></span>
                  </button>
                  <div class="collapse justify-content-center  navbar-collapse" 
         id="navbarcollapse">
                      <ul class ="navbar-nav mr-auto">
                          <li class="nav-item  active"><a href="#"class="nav- 
      link">Home</a></li>
                          <li><a href="#" class="nav-link">Services</a></li>
                          <li><a href="#"class="nav-link">Downloads</a></li>
                          <li><a href="#"class="nav-link">Projects</a></li>
                          <li><a href="#"class="nav-link">About Us</a></li>
                          <li><a href="#"class="nav-link">Contact</a></li>
                      </ul>
                  </div>

              </nav>

          </div>

Answer 1

在justify-content-between w-100上使用navbar-nav均匀分配导航项...

  <ul class="navbar-nav justify-content-between w-100">
        <li><a href="#" class="nav-link active">Home</a></li>
        <li><a href="#" class="nav-link">Services</a></li>
        <li><a href="#" class="nav-link">Downloads</a></li>
        <li><a href="#" class="nav-link">Projects</a></li>
        <li><a href="#" class="nav-link">About Us</a></li>
        <li><a href="#" class="nav-link">Contact</a></li>
  </ul>

https://www.codeply.com/go/zkgcXDSqTf

将链接放置在Bootstrap导航栏中以传播到所有导航栏区域

1 个答案: