0

タイトルは少し誤解を招くかもしれませんが、この効果がどのように呼び出されるかは 100% わかりません。私が言いたかったのは、ナビゲーション バーが折りたたまれているのではなく消えているということです。

ただし、私のセットアップはこれです-私はプロジェクトのLayoutビューに取り組んでいます。ASP.NET MVC 4私は使用していますが、ライブラリbootstrap 3xも含まれているため、私の部分は次のようになります。jQuery<head>

@Scripts.Render("~/Scripts/bootstrap.min.js")
@Styles.Render("~/Content/bootstrap.css")
@Styles.Render("~/Content/themes/base/jquery.ui.smoothness.css")
@Scripts.Render("~/Scripts/jquery-2.0.3.min.js")
@Scripts.Render("~/Scripts/jquery-ui-1.10.3.min.js")
//just skipped the standard stuff

本文にはnavbars、すべてのページで同じになる 2 つと 1 つのサイド メニューが必要ですが、ある時点でウィンドウを狭くし始めると、この例と同様の効果が得られないことに気付きました (要素が再配置されます) 両方ともnavbarsなくなってしまい、見えません。

私の最初のマークアップnavbarはこれです：

<div class="navbar navbar-static-top navbar-inverse navbar-collapse collapse" role="navigation">
        <ul class="nav navbar-nav ">
            <li><a href="#">Info</a></li>
            <li><a href="#">Info</a></li>
        </ul>
    </div>

2つ目は次のとおりです。

<div class="navbar navbar-collapse collapse" role="navigation" id="main-navigation-bar">
        <ul class="nav nav-pills nav-justified">
            <li style="border: 1px solid grey"><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
        </ul>

_Layout実際、私の体に残っているのはこれだけです。

<div class="container-fluid">
        @RenderBody()
    </div>

これは単にコンパイルを目的としており、このビューをレンダリングします:

<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>

そのため、ナビゲーション バーが消えるようにウィンドウを十分に小さくすると1..5、レンダリングされたビューの数字だけが残ります。

私は1つだけでテストしましnavbarた（もう1つにコメントしました）-どちらがコメントされていても、ウィンドウを狭くするとナビゲーションバーが失われます。どうすればそれらを使い続けることができbootstrap 3xますか?

4

2 に答える 2

1

バージョン 3 への Bootstrap の更新を読み始めます- 何をしなければなりませんか? v3を使用している間、あなたの例ではTwitterのBootstrap v2を使用しています。

いくつかのメモ:

  • v3 にはコンテナ流体クラスがありません
  • jQuery v2 はサポートされていません (最新の v1 を使用してください)
  • Bootstrap はページ上の複数のナビゲーション バーをサポートしていません。https://github.com/twbs/bootstrap/issues/10229 および Twitter の Bootstrap 3 を使用した同じページ上の複数のナビゲーション バーも参照してください。
  • 2 番目のナビゲーション バーにクラスがありません。https ://github.com/twbs/bootstrap/issues/10332 を参照してください。
于 2013-11-12T21:51:49.080 に答える
1

navbars の構造は、 navbar のドキュメントで概説されているものと一致していないようです。

特に、メインの navbar div に.navbar-collapseandをドロップしています。.collapseこのクラスは、画面の幅が特定のポイントに達すると、内部のすべてのコンテンツを非表示にするため、ドキュメントでリンクしたものと同様のことができると思います。

ドキュメントに記載されている内容と一致するようにナビゲーション バーを再構成すると、発生している問題が解消されると確信しています。

PS - クラス.container-fluidはもう存在しません。.containerBootstrap 3 で使用するだけです。

于 2013-11-12T21:52:01.107 に答える