I have a small tabbed navigation setup using CSS. When hovering over the tabs the colour changes, great. However when i click a tab and it navigates to the corresponding page, i would like that tab (the active tab?) to remain highlighted, indicating the current page.
I am currently doing this by using a class (.currenttab ) and then using this class in each HTML file. I am not using:
active
Is there a way for me to use active, rather than using a class in each individual HTML file, or is what i am doing correct?
Thank you in advance.
What you are doing is correct. The :active pseudo selector means something else - the event of activating a control (ie, the time between a user presses the mouse button and releases it).
Using a class to signify the selected item is the way to go.
It's far from ideal, but if you give every page and every tab an id, you can define the highlighting in css instead of html. I ran across a full explanation while looking up the active attribute:
Highlighting Current Page With CSS
A site I designed with this technique (pages, not tabs)
Here are some more examples brainjar Demo
More from Brainjar