I wanted to change the color of the text in my nav bar, to #b3b3b3 to be exact, but it looks like there are only the colours available that bootstrap gives me, how can I change this?

I am a beginner programmer and this is my first time building a website.

<nav  style="color: #b3b3b3; background-color: #121212;">
    <div >
      <a  href="#">Navbar</a>
    </div>
</nav>

I tried this, just a pure guess, but it doesn't seem to work

CodePudding user response：

To change the color of the text in the nav, you need to change the <a> tag's color, not the <nav> tag.

Try this:

<nav  style="background-color: #121212;">
    <div >
      <a  href="#" style="color: #b3b3b3">Navbar</a>
    </div>
</nav>

or you can do this in style

nav a {
color: #b3b3b3;
}

CodePudding user response：

Have you tried with css?

like

.custom-navbar {
    color: #b3b3b3;
}

CodePudding user response：

I can see you've already got your answer, but here are some alternative ways you can do this in future:

1. Apply property directly to the class (or id if you want to use this property only once) in CSS file (perhaps the most useful way):

.navbar-brand {
  color: #b3b3b3;
}

2. Apply property using class names and child combinator in CSS file:

.navbar > .container-fluid > .navbar-brand  {
  color: #b3b3b3;
}

3. Apply property using tags and child combinator in CSS file:

nav > div > a {
 color: #b3b3b3;
}

4. Applied an in-line style to the tag (not the best practice):

<nav  style="background-color: #121212;">
 <div >
   <a  href="#" style='color: #b3b3b3;'>Navbar</a>
 </div>
</nav>