css - Bootstrap 4, bg-inverse not showing?

Question

Trying to follow the navbar example in Bootstraps documentation, I have a problem where the background colour of the navbar doesn't get loaded.

<nav class="navbar navbar-inverse bg-inverse">
    <a class="navbar-brand" href="#">Navbar</a>
</nav> 

I took a look in bootstrap.css and bg-inverse does not appear there. Am I supposed to create the colours myself, or am I doing something wrong? (I am working in an Angular project)

Answer 1

I think you are using Bootstrap beta version. Use the Alpha version. It will solve the problem , they are not provide bootstrap 4 beta for the navbar-inverse bg-inverse

bootstrap -v 4.0.0.alpha6

<nav class="navbar navbar-inverse bg-inverse">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-inverse bg-primary">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-light" style="background-color: #e3f2fd;">
  <!-- Navbar content -->
</nav>

look at this https://getbootstrap.com/docs/4.0/components/navbar/

bootstrap@4.0.0-beta

<nav class="navbar navbar-dark bg-dark">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-dark bg-primary">
  <!-- Navbar content -->
</nav>

<nav class="navbar navbar-light" style="background-color: #e3f2fd;">
  <!-- Navbar content -->
</nav>

look at this https://getbootstrap.com/docs/4.0/components/navbar/