Bootstrap 3 - navbar下拉菜單不能用於額外的html頁面

我在dreamweaver中使用bootstrap 3或更少版本創建了一個網站。Bootstrap 3 - navbar下拉菜單不能用於額外的html頁面

我已經使用了navbar默認並定製它。

我也只是增加了一些額外的頁面到我的網站，如about.html和blog.html

然而，這些額外的頁面的下拉菜單中似乎並沒有工作。它確實在主頁上工作正常，代碼完全相同。

我已經用< li>包裝好了，只需將所有html複製並粘貼到我的新html文件中，如下所示，即可在每個頁面上都有navbar。請告知如果我做錯了什麼，我幾乎是一個完整的初學者。謝謝！

<div class="header clearfix"> 
    <nav class="text-center"> 
     <ul class="nav nav-pills"> 
      <li role="presentation" class="active"><a href="#">Home</a></li> 
      <li> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Our Services <span class="caret"></span></a> 
       <ul class="dropdown-menu"> 
        <li><a href="#">jhdhalbalb</a></li> 
        <li><a href="#">hdjdjjdj</a></li> 
        <li><a href="#">bdjdshbd</a></li> 
       </ul> 
      </li> 
      <li role="presentation"><a href="About us.html">About us</a></li> 
      <li role="presentation"><a href="Blog.html">Blog</a></li> 
      <li role="presentation"><a href="#">Contact</a></li> 
     </ul> 
    </nav> 
</div>

來源

2016-03-05 ck777

您是否檢查了[控制檯]（https://developers.google.com/web/tools/chrome-devtools/debug/console/?hl=en）以查看jQuery和BootstrapJS是否都加載了網頁？ – vanburen

我應該把鏈接放在底部，就像我在index.html頁面中做的那樣？謝謝 – ck777

一下添加到您的所有網頁的頭部分：

<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 

<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

有時引導本地文件不工作 - 這樣做會讓你知道，如果你要重新下載。這是以前發生在我身上的事情。

此外，您的HTML非常混亂，很難真正查看。嘗試清理一下，並確保您遵循W3 standards，以便您可以按照您的代碼和其他人可以閱讀它。

您還應該閱讀：http://getbootstrap.com/javascript/#dropdowns Bootstrap下拉菜單需要額外的.js插件。

來源

2016-03-05 04:15:48

嘿，謝謝你，我會去的。這就說得通了。我沒有在其他html文件中加入任何鏈接，我會這樣做。我有dropdown.js，它在我的節點文件夾中。在主頁上正常工作，只是不是手動添加的額外頁面 – ck777

您的意思是我的代碼很糟糕，因爲寫得不好或者佈局糟糕？如果是後者，它將是我在這裏複製並粘貼的方式。如果寫得不好，我怎麼寫得更好？請指教。一直在使用W3學校 – ck777

我現在正在工作，我沒有在HTML文件中添加引導程序和jQuery鏈接以獲取額外的頁面。謝謝！ – ck777

Bootstrap 3 - navbar下拉菜單不能用於額外的html頁面

回答

相關問題