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

debugcn 发表于 Dev

托比

我使用 bootstrap 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>

齐姆

使用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

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。