ブートストラップメニュー - ボタンでメニューが表示されませんでした。メニューは右側に行く間、ボタンが左側に

Question

ですこれは私のコードです：

<div class="dropdown"> 
     <button type="button" class="navbar-toggle1 " data-toggle="dropdown" data-target="#navbar" aria-expanded="true" aria-controls="rep_options"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <i class="fa fa-bars" aria-hidden="true" style=" font-size: 27px;"></i> 
     </button> 
     <ul class="dropdown-menu" style="margin-top: 8%; margin-left: 91%;"> 
      <li><a href="#">HTML</a></li> 
      <li><a href="#">CSS</a></li> 
      <li><a href="#">JavaScript</a></li> 
     </ul>  
    </div>   
</div> 

私のメニューがボタンで表示されませんでした。メニューでは、ブートストラップ用のjsファイルが含まれていない可能性があり

Answer 1

<header id="header" class="active"> 
    header 
</header> 

<button id="button">Toggle</button> 

<style> 
header{ 
    display:none; 
    border:solid 1px #F00; 
    height: 50px; 
} 

header.active{ 
    display:block; 
} 

</style> 

<script> 

    var button = document.getElementById("button"); 
    var header = document.getElementById("header"); 

    button.onclick = function(){ 
     header.classList.toggle("active"); 
    }; 
</script> 

example

Answer 2

右側に行く間、ボタンが左側にあります。このリンクをファイルに含めてから、もう一度やり直してください。 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>