引導禁用崩潰/切換導航欄上

當窗口調整大小時，如何讓我的導航欄不崩潰/切換？我試圖加入引導禁用崩潰/切換導航欄上

.collapse{ 
    display: inline-block; 
}

我的CSS。有了這個，當窗口被調整大小時，導航欄元素將最終堆疊。我還使用自舉4阿爾法6

這裏是我的導航欄代碼：http://www.bootply.com/mHeWTUSxAM

來源

2017-04-02 Karol Grycuk

updated Bootply

只是代替navbar-toggleable-md使用navbar-toggleable-xl。

工作片斷

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous"> 
 
<nav class="navbar navbar-toggleable-xl navbar-inverse bg-inverse"> 
 

 
    <div class="navbar-collapse collapse" id="collapsingNavbar"> 
 
    <ul class="navbar-nav"> 
 
     <li class="nav-item"> 
 
     <a href="#menu-toggle" class="nav-link" id="menu-toggle">Menu</a> 
 
     </li> 
 
    </ul> 
 
    <ul class="navbar-nav dropdown dropdown-menu-right ml-auto"> 
 
     <li class="nav-item "> 
 
     <a class="nav-link dropdown-toggle" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">logged in as</a> 
 

 
     <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdown01"> 
 
      <a class="dropdown-item" href="#">Logout</a> 
 
      <a class="dropdown-item" href="#">My Movements</a> 
 
     </div> 
 
     </li> 
 
    </ul> 
 
    </div> 
 

 
</nav>

來源

2017-04-02 07:56:28 neophyte

how i did it is by giving .btn.btn-navbar{display:none;} 
and by giving .nav-collapse{height:auto} 
it worked like this but i believe it is not best solution 
referenced to bootstrap 4 documentation you should look into that "Responsive behaviors

導航欄可以利用.navbar-toggler，.navbar崩潰，並.navbar-toggleable- *類當他們的內容在按鈕後面崩潰時更改。在與其他實用程序組合，您可以輕鬆地選擇何時顯示或隱藏特定的元素。」

來源

2017-04-02 06:58:28

引導禁用崩潰/切換導航欄上

回答

相關問題