Skip to content Skip to sidebar Skip to footer

Easiest Way To Class "current Page" Nav Element?

I have a navigation bar on my webpage with links to different pages. Is there an easy way to automatically set the class on the navigation element corresponding to the current pag

Solution 1:

i've used this before and it works well.

http://www.cssnewbie.com/intelligent-navigation/

Solution 2:

If you want a pure HTML/CSS solution, the best I can think of is to put a class on the body describing which tab should be highlighted, and an id on each tab, then target the tabs from there via CSS.

So for the HTML, the "About Us" page would have something like <body class="AboutUs"> while the "Home" page would have a similar <body class="Home">. The tabs would each have unique ids like "aboutUs" and "home".

Then in the CSS, you could style it like so:

body.AboutUstabs#aboutUs,
body.Hometabs#home
{
    /* selection style goes here */
}

Post a Comment for "Easiest Way To Class "current Page" Nav Element?"