1

Bootstrap を使用してサイトを構築していますが、Bootstrap のデフォルト スタイルではページの両側にパディングが強制されるため、ナビゲーション バーをページの全幅に広げることができませんでした。

次の CSS を追加してこの問題を修正しましたが、これにより新たな問題が発生しました。

@media (max-width: 767px) {
  body {
    padding-right: 0px;
    padding-left: 0px;
  }

新しい問題は、これによりデスクトップ サイズのスタイリングが無視されるため、ブラウザー ウィンドウが電話サイズの場合にのみ正しく表示されることです。

これを回避する唯一の方法は、@media の目的とその仕組みを理解することだと思います。または、@media を変更する必要のない全幅のナビゲーション バーを作成するためのより良い方法があるでしょうか?

全幅のナビゲーション バーを備えた Bootstrap サイトを見たことがありますが、これを実現するために Bootstrap のコードのどの部分が変更されたかを理解できませんでした。@media を変更することが、私が理解できる唯一の方法です。

どんな助けでも大歓迎です。

4

1 に答える 1

0

最初のdivを次のように変更できます

<div class="navbar navbar-static-top">

静的で常に全幅にしたい場合。しかし、これは応答しなくなります。ただし、メディア クエリで行ったことは機能し、デスクトップ スタイルには影響しません。

要素を中央に配置するための編集ここでこのディスカッションを確認してくださいいくつかの素晴らしい答えがあります

于 2013-06-12T06:43:15.230 に答える