Search code examples
twitter-bootstrapnavbar

On Bootstrap v5.3: Need help understanding navbar bg-dark" and data-bs-theme="dark"

On this link: https://getbootstrap.com/docs/5.3/components/navbar/

If you scroll down to "Color schemes"

 <nav class="navbar bg-dark" data-bs-theme="dark">
   <!-- Navbar content -->
 </nav>
  1. What is the difference bg-dark and data-bs-theme="dark"?

If you scroll down to "External content"

<nav class="navbar navbar-dark bg-dark">
  1. How come the data-bs-theme="dark" is eliminated?
Solution

  • As they write in the paragraph above code you posted:

    New dark navbars in v5.3.0 — We’ve deprecated .navbar-dark in favor of the new data-bs-theme="dark". Add data-bs-theme="dark" to the .navbar to enable a component-specific color mode. Learn more about our color modes.

    Also data-bs-theme is for using different color schemes. Not just light or dark, you can define your own. See more in Color modes documentation.