如何使“ flex辩解”在导航栏中工作

时间:2019-04-06 13:41:24

标签: html5 bootstrap-4

我正在使用引导程序在navbar上工作,并且仅在nav类上遇到问题,即 justify-content-lg-around ,这是行不通的,我也不知道。

 <nav class="navbar navbar-expand-lg navbar-dark bg-dark justify-content- 
       lg-around fixed-top">

       <a href="" class="navbar-brand"><img src="bluelogo.jpg" width="50" height="50" alt="" class="mx-1" />blues nepal</a>
       <button class="navbar-toggler" data-toggle="collapse" data-target="#blueenav">
           <span class="navbar-toggler-icon"></span>
       </button> 
       <div class=" collapse navbar-collapse w-auto" id="blueenav">
          <ul class="navbar-nav">
              <li class="nav-item">
                  <a href="" class="nav-link">home</a>
              </li>
              <li class="nav-item">
                  <a href="" class="nav-link">courses</a>
              </li>
              <li class="nav-item">
                  <a href="" class="nav-link">about</a>
              </li>
              <li class="nav-item">
                  <a href="" class="nav-link">blog</a>
              </li>
           </ul>
           <button class="btn btn-danger rounded">APPLY</button>
       </div>

    </nav>

实际上,不仅证明内容合理,而且flex属性均无效。

1 个答案:

答案 0 :(得分:0)

仅当您在引导程序中使用d-flex使CSS父级div灵活或在CSS中显示flex时,才能在nav标签的flex属性中添加类d-flex。