Bootstrap導航欄切換不會自動填充

-1

我第一次使用引導程序，並且在線查看了有關切換菜單的示例，可以使用非切換版本中的所有鏈接自動填充自己。我試圖在下面這樣做，但由於某種原因，我的似乎沒有工作。Bootstrap導航欄切換不會自動填充

我也看遍了所有，但無法找到任何答案在其他帖子或網站，可以幫助我。

任何幫助將非常感激。

<nav class="navbar"> 
    <div class="container-fluid"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavbar"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button> 
     </div> 

     <div class="collapse navbar-collapse" id="myNavbar"> 
      <ul class="navi nav navbar-nav"> 
       <li class="dropdowni dropdown"> 
        <a class="dropdowni dropdown-toggle" id="nobackground" data-toggle="dropdown" href="#">Option 1</a> 
        <ul class="dropdowni dropdown-menu"> 
         <a href="#"><li>Option 1-1</li></a> 
         <a href="#"><li>Option 1-2</li></a> 
         <a href="#"><li>Option 1-3</li></a> 
         <a href="#"><li>Option 1-4</li></a> 
         <a href="#"><li>Option 1-5</li></a> 
        </ul> 
       </li> 
       <li id="grey">//</li> 
       <li><a id="nobackground" href="#">Option 2</a></li> 
       <li id="grey">//</li> 
       <li><a id="nobackground" href="#">Option 3</a></li> 
       <li id="grey">//</li> 
       <li><a id="nobackground" href="#">Option 4</a></li> 
      </ul> 
     </div> 
    </div> 
</nav>

對不起，如果我的代碼很混亂 - 我之前沒有做過很多web開發。我猜這是針對<li>和<a>標籤的一些訂購，但我無法解決這個問題。

謝謝。

來源

2016-07-22 fierynot

看一看的引導文件：http://getbootstrap.com/components/#navbar –

我已經做了，可惜是沒有幫助我 - 也許我只是不明白它雖然 – fierynot

你包括'bootstrap.js'嗎？ – Sankar

嗨你的代碼工作完美，只是看到這裏的預覽。 see the output 我只在標籤中添加了navbar默認類。

<!DOCTYPE html> 
<html> 

<head> 
    <script data-require="[email protected]" data-semver="2.2.0" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
    <script data-require="[email protected]*" data-semver="3.3.6" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
    <link data-require="[email protected]" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" /> </head> 

<body> 
    <nav class="navbar navbar-default"> 
     <div class="container-fluid"> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNavbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> 
      </div> 
      <div class="collapse navbar-collapse" id="myNavbar"> 
       <ul class="navi nav navbar-nav"> 
        <li class="dropdowni dropdown"> <a class="dropdowni dropdown-toggle" id="nobackground" data-toggle="dropdown" href="#">Option 1</a> 
         <ul class="dropdowni dropdown-menu"> 
          <a href="#"> 
           <li>Option 1-1</li> 
          </a> 
          <a href="#"> 
           <li>Option 1-2</li> 
          </a> 
          <a href="#"> 
           <li>Option 1-3</li> 
          </a> 
          <a href="#"> 
           <li>Option 1-4</li> 
          </a> 
          <a href="#"> 
           <li>Option 1-5</li> 
          </a> 
         </ul> 
        </li> 
        <li id="grey">//</li> 
        <li> <a id="nobackground" href="#">Option 2</a> </li> 
        <li id="grey">//</li> 
        <li> <a id="nobackground" href="#">Option 3</a> </li> 
        <li id="grey">//</li> 
        <li> <a id="nobackground" href="#">Option 4</a> </li> 
       </ul> 
      </div> 
     </div> 
    </nav> 
</body> 

</html>

來源

2016-07-22 11:54:38

嗨，謝謝，它正在工作！它必須是我的「navi」CSS類出於某種原因 - 當我刪除它的工作，但格式不好。再次感謝你！ – fierynot

Bootstrap導航欄切換不會自動填充

回答

相關問題