bootstrap漢堡包不按預期工作

我想弄清楚我哪裏出錯了，但我沒有看到任何錯誤..讓銳利的眼睛的人告訴我，我哪裏出錯了。代碼如下所示..bootstrap漢堡包不按預期工作

<!DOCTYPE html> 
<html> 
<head> 
    <title>bootstrap</title> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 

    <link rel="stylesheet" type="text/css" href="portfolio.css"> 

    <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"> 

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css"> 
</head> 
<body> 


    <nav class = "navbar navbar-inverse"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#icons"> 
       <span class="sr-only">toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="#">Zack</a> 
     </div> 

     <div class="collapse navbar-collapse" id="icons"> 
      <ul class="nav navbar-nav"> 
       <li><a href="#">About Me</a></li> 
       <li><a href="#">Skills</a></li> 
       <li><a href="#">Projects</a></li> 
       <li><a href="#">Contact Me</a></li> 
      </ul> 
     </div> 
    </nav> 





<script type="text/javascript" src="jquery-3.2.1.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 



</body> 
</html>

非常感謝stackoverflow開發人員。 :)

來源

2017-10-29 Zack

請你能完成的問題與預期結果或爲什麼你認爲它不工作？ – PRMoureu

這就是整個代碼。當我點擊漢堡包時，它應該已經擴大了導航菜單顯示，但它不工作。 @PRMoureu – Zack

我只包括jQuery和它的正常工作。你很有可能錯過了jquery-3.2.1.js文件或者src路徑不正確。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<link rel="stylesheet" href="portfolio.css"> 
 
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet"> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<nav class = "navbar navbar-inverse"> 
 
    <div class="navbar-header"> 
 
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#icons"> 
 
     <span class="sr-only">toggle navigation</span> 
 
     <span class="icon-bar"></span> 
 
     <span class="icon-bar"></span> 
 
     <span class="icon-bar"></span> 
 
    </button> 
 
    <a class="navbar-brand" href="#">Zack</a> 
 
    </div> 
 
    <div class="collapse navbar-collapse" id="icons"> 
 
    <ul class="nav navbar-nav"> 
 
     <li><a href="#">About Me</a></li> 
 
     <li><a href="#">Skills</a></li> 
 
     <li><a href="#">Projects</a></li> 
 
     <li><a href="#">Contact Me</a></li> 
 
    </ul> 
 
    </div> 
 
</nav>

來源

2017-10-29 08:31:44 VXp

嘗試在你的頭上添加此

<meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

基本上你忘記觸發視這應該工作

來源

2017-10-29 07:55:09

我補充說，它仍然不工作.. @Rushabh sheth – Zack

bootstrap漢堡包不按預期工作

回答

相關問題