Navbar collapse not working

Question

私はこれを修正するために何時間も努力してきましたが、私の周りに頭を浮かべることはできません。

<!-- navbar --> 
    <nav class="navbar navbar-default" role="navigation"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
    <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="nav navbar-nav"> 
     <li class="upage"><a href="index.html">home</a></li> 
     <li><a href="team.html">team</a></li> 
     <li><a href="services.html">services</a></li> 
     <li><a href="events.html">events</a></li> 
     <li><a href="team.html">store</a></li> 
    </ul> 
    </div> 
    </nav> 
    <!-- navbar --> 

私のブートストラップ・ナビゲーションバーのための私のHTMLですが、私のCSS

だ

.navbar .nav > li > a { 
    color: #F2F4F4; 
    font-family: 'Oxygen', sans-serif; 
    font-weight: 300; 
    font-size: 20px; 
    text-transform: ; 
    padding-left: 35px; 
    text-decoration: none; 
    } 

.navbar-default { 
    margin-top: 0px; 
    background: #000; 
    background: rgba(0,0,0,0.4); 
    border-color: transparent; 
} 


@media (min-width: 768px){ 
    .navbar-nav { 
     float:none; 
     margin: 0 auto; 
     display: table; 
     table-layout: fixed; 
    } 
} 

をクリックしたときに、残念ながら崩壊のボタンが機能していないことを、私は、誰かが私を助けることを願ってありがとうございます！

Answer 1

<div class="navbar-header"> 
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> </button> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
</div> 

このようにそれを試してみてください...ここで

Answer 2

が作業スニペットはこれを確認ですが、私はbootstrapスタイルシートとbootstrap.jsを追加し、jqueryライブラリが含まれているこの

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
<!-- navbar --> 
 
    <nav class="navbar navbar-default" role="navigation"> 
 
    <div class="navbar-header"> 
 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
 
    <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="nav navbar-nav"> 
 
     <li class="upage"><a href="index.html">home</a></li> 
 
     <li><a href="team.html">team</a></li> 
 
     <li><a href="services.html">services</a></li> 
 
     <li><a href="events.html">events</a></li> 
 
     <li><a href="team.html">store</a></li> 
 
    </ul> 
 
    </div> 
 
    </nav> 
 
    <!-- navbar --> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
<!-- Latest compiled and minified JavaScript --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

をご確認ください。

Answer 3

あなたのコードは正常に動作しています。私はエラーm AY

<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 

jqueryのは、最初にしてbootstrap.js ..

にする必要があります。..スクリプトは、以下の順で行われたことを確認してください。..ロードされたスクリプトであること