小さな画面では Navbar とハンバーガー メニューが表示されなくなるのはなぜですか?

小さい画面で消えたナビゲーションバーとハンバーガーメニューを修正する

問題:

ナビゲーションバーに中央のロゴ画像は大画面でも問題なく機能します。ただし、画面を縮小すると、ロゴ画像やハンバーガーメニューも含めてすべてが消えてしまいます。この問題はどのように解決できますか?

解決策:

小さな画面でも視認性を維持するには、ナビゲーションバーに背景色があるか、適切な CSS クラスが追加されていることを確認してください。

• Bootstrap 5 の場合: navbar-light またはnavbar-dark と navbar-light bg-light または navbar-dark bg-dark を背景色として使用します。

<nav>

• Bootstrap 4.0.0 以降の場合: navbar-light bg-light または navbar-dark bg-dark のいずれかを使用するか、カスタム背景色を追加しますCSS 経由。

<nav>

#navbar-primary .navbar-nav {
  background: #ededed;
}

または、ハンバーガー トグラーを暗くして視認性を向上させることもできます。

.navbar-toggle .icon-bar {
  background-color: rgb(136, 136, 136);
}

更新情報:

Bootstrap 5 の場合、navbar-light またはnavbar-dark クラスはハンバーガー メニューを表示するために不可欠です。

以上が小さな画面では Navbar とハンバーガー メニューが表示されなくなるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。