The easiest way to nav class?

I have a navigation bar on my web page with links to different pages. Is there a simple way to automatically set the class in the navigation item corresponding to the current page? For example, I want the About Us tab in the panel to have a different style if you are currently viewing the About Us page. I know that I could fine-tune some PHP for each page, but I would prefer to have a more general set-it-and-forget-it solution.

+4
source share
2 answers

I have used this before and it works well.

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

+3
source

If you want a clean HTML / CSS solution, it's best to think of putting a class in the body that describes which tab should be highlighted and the identifier on each tab, and then customize the tabs using CSS.

So, for HTML, the About us page will have something like <body class="AboutUs"> , and the Home page will have a similar <body class="Home"> . Each tab will have unique identifiers like "aboutUs" and "home".

Then in CSS you can create it like this:

 body.AboutUs tabs#aboutUs, body.Home tabs#home { /* selection style goes here */ } 
+3
source

Source: https://habr.com/ru/post/1311821/


All Articles