Make Twitter Bootstrap navbar link active

Question

What\'s the standard way to make the active link in a Twitter Bootstrap navbar bolded? It\'s clear that a link gains the active appearance by gaining the \"active\" class. F

Answer 1

You can solve it with CSS.

Add a class to the body of each page:

Or if you're on the contact page:

Then take this into consideration when you're creating your styles:

ul li:hover, body.home a.home, body.contact a.contact { background-color: #000; } 
ul li:hover a, body.home li.home a, body.contact li.contact a { color: #fff; }

Lastly, apply class names to your list items:

  
Home
  
Contact Us
  
About Us

This point, whenever you're on the body.home page, your li.home a link will have default styling indicating it is the current page.