I\'m creating a navigation menu with words with different colors (href
links). I would like the color NOT to change on any state (hover, visited etc).
I
You can simply define a style for links, which would override a:hover
, a:visited
etc.:
a {
color: blue;
text-decoration: none; /* no underline */
}
You can also use the inherit
value if you want to use attributes from parent styles instead:
body {
color: blue;
}
a {
color: inherit; /* blue colors for links too */
text-decoration: inherit; /* no underline */
}
if you state a.redLink{color:red;}
then to keep this on hover and such add a.redLink:hover{color:red;}
This will make sure no other hover states will change the color of your links
You can just use an a
selector in your stylesheet to define all states of an anchor/hyperlink. For example:
a {
color: blue;
}
Would override all link styles and make all the states the colour blue.
As Chris said before me, just an a
should override. For example:
a { color:red; }
a:hover { color:blue; }
.nav a { color:green; }
In this instance the .nav a
would ALWAYS be green, the :hover wouldn't apply to it.
If there's some other rule affecting it, you COULD use !important
, but you shouldn't. It's a bad habit to fall into.
.nav a { color:green !important; } /*I'm a bad person and shouldn't use !important */
Then it'll always be green, irrelevant of any other rule.