為什麼我的導覽列和漢堡選單會在較小的螢幕上消失？

Fixing Vanishing Navbar and Hamburger Menu on Smaller Screens

Problem:

A navbar with a logo image in the center functions flawlessly on large screens. However, when the screen is reduced, everything, including the logo image and hamburger menu, vanishes. How can this issue be resolved?

Solution:

To maintain visibility on smaller screens, ensure that the navbar has either a background color or the appropriate CSS classes added:

• For Bootstrap 5: Use navbar-light or navbar-dark along with navbar-light bg-light or navbar-dark bg-dark for background color.

<nav>

• For Bootstrap 4.0.0 and older: Use either navbar-light bg-light or navbar-dark bg-dark, or add a custom background color via CSS.

<nav>

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

Alternatively, you can darken the hamburger toggler to improve its visibility.

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

Updated Information:

For Bootstrap 5, the navbar-light or navbar-dark classes are essential for displaying the hamburger menu.

以上是為什麼我的導覽列和漢堡選單會在較小的螢幕上消失？的詳細內容。更多資訊請關注PHP中文網其他相關文章！