If you noticed you now see a .bod between the standard anchor code. This is our Pseudo class. Whenever we define a class="bod" in our anchor tags it will call on this code and override our standard code that the drop down menu uses. So here is the full code I used for this site.
A:link {color:#363636; font-weight:400; text-decoration: none}
A:active {color:#FFFFFF; font-weight:light; text-decoration:none}
A:visited {color:#363636; font-weight:400; text-decoration:none}
A:hover {color:#000000; font-weight:500; text-decoration:none}
A.bod:link {color:#FF8500; font-weight:400; text-decoration:none}
A.bod:active {color:#FFFFFF; font-weight:400; text-decoration:none}
A.bod:visited {color:#FF8500; font-weight:400; text-decoration:none}
A.bod:hover {color:#FFFFFF; font-weight:500; text-decoration: none}
Whenever I use a standard
<a href="page.php">link</a>
it displays the standard anchor code. Now when I want to use the Pseudo class to make the link color display the new color so you can actually read it in this dark part of the page I tell the anchor tag to use the Pseudo class. This is done by adding the class element to your anchor tag. All you need to do is add
<a href="page.php" class="bod">link</a>
to your tags. You can name your Pseudo class any name you wish. I just used "bod" because the only time I use it is in the body of my page. That's it. Now you can have multiple colors for your links if you need them. |
