ブートストラップ付き携帯電話のメニューを切り替えます

Question

私はメニューを右上に作成するためにブートストラップを使用しています。

デスクトップの場合は、私がモバイル環境のためのブラウザは狭くする場合は、右上正しく

に示された4つのメニューがあります。 その行のアイコンが表示されますが、クリックしても何も起こりません。

これは私のソースコードですが、ポイントはありますか？

<div class="navbar navbar-default navbar-fixed-top"> 
    <div class="container-fluid"> 
     <div class="navbar-header"> 
      <a href="/whitebear/web/app_dev.php/" class="navbar-brand"> 
      <img height="30px;" src="/whitebear/web/bundles/acmetop/img/whitebearLogo.png"></a> 
      <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button> 
     </div> 
     <div id="navbar-main" class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav navbar-right"> 
       <li><a href="/whitebear/web/app_dev.php/nice">Nice</a></li> 
       <li><a href="/whitebear/web/app_dev.php/qanda">Q & A</a></li> 
            <li><a href="/whitebear/web/app_dev.php/login">login</a></li> 
       <li><a href="/whitebear/web/app_dev.php/register/" >register</a></li> 

         </ul> 
     </div> 
    </div> 
</div> 

Answer 1

データ・ターゲット属性値のID（＃1ナビゲーションバー - メイン）でメニューリストをラップするためのdivを追加

<div id="navbar-main" class="navbar-collapse collapse"> 
    <ul class="nav navbar-nav navbar-right"> 
    // li list 
    </ul>