8

私の質問は、ナビゲーション コンテンツをページ コンテンツの幅に合わせて 100% にならないようにするにはどうすればよいかということです。私はまだ黒いナビゲーションの背景を100％にしたい. ナビゲーションバー固定トップでこれを実現できますが、ナビゲーションを固定したくありません。通常、コンテナがこれを行いますが、このシナリオでは、コンテンツの自動マージは行いません。

このようなナビメニューがあります。

<div class="navbar">
  <div class="navbar-inner">
    <div class="container">

      <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>

            <a class="brand visible-phone visible-tablet" href="#">Brand</a>

            <div class="nav-collapse">
                <ul class="nav">
                  <li class="active"><a href="#">Item 1</a></li>
                  <li><a href="#">Item 2</a></li>
                  <li><a href="#">Item 3</a></li>
                </ul>

            </div>

    </div>
  </div>
</div><!-- END .navbar -->
4

1 に答える 1

11

私はこれを理解したので、誰かがここで知る必要がある場合は解決策です. ナビ全体を #navbar-top ID でラップしています。Bootstrap をグローバルにオーバーライドしないようにするため、これをお勧めします。

@media (min-width: 1200px) {
    #navbar-top .container {
        width:1170px;
    }   
}
@media (min-width: 979px) and (max-width: 1200px) {
    #navbar-top .container {
        width:960px;
    }   
}
@media (min-width: 768px) and (max-width: 979px) {
    #navbar-top .container {
        width:744px;
    }   
}

これにより、navbar が固定されていない場合でも、.container が各解像度で幅を持つようになります。

于 2012-07-15T04:03:54.703 に答える