html - Bootstrap 3 Navbar が応答しない

Question

応答性を確保するために、さまざまなデバイスでブートストラップ サイトをテストしてきました。ナビゲーションバーを除いて、さまざまな表示サイズに合わせてすべてのサイズを正しく変更しました。私のブラウザでは、ウィンドウを水平方向にサイズ変更すると、期待どおりにメニューが折りたたまれているように見えますが、モバイル デバイスでは、デスクトップまたはラップトップの全画面ウィンドウに表示されているかのようにナビゲーション バーが表示されます。私のnavbarのコードは次のとおりです。

<div class="container">
  <nav class="navbar navbar-default navbar-fixed-top">
    <div class="container-fluid">
      <div class="navbar-header">
        <a class="navbar-brand" href="#">
          <img alt="WinShir" src="img/rocket.png" /> WinShir
        </a>
        <button type='button' class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="sr-only">Toggle Navigation</span>
        </button>
      </div>

      <ul class="nav navbar-nav navbar-right collapse navbar-collapse">
        <li><a href="#signInModal" data-toggle="modal">Sign In</a></li>
        <li><a href="#signupModal" data-toggle="modal">Sign Up</a></li>
      </ul>
    </div>

  </nav>
</div>

nav 要素を div に変更して、それが成功しないかどうかを確認してみました。また、囲んでいるコンテナ クラス div を削除して、それがうまくいかないかどうかを確認しました。