DevHints

CSS: Change the default link style

Posted on: October 21, 2006

One of the most common things people do with CSS is change the style of the links in a page. I’d highly recommend it since the default links usually won’t work with your color palette, considering they are bright blue, bright purple, and bright red.

To simply make all links the same color with the default styling, simply add the following line to your CSS file or style tag:

a { color: #FFAACC; }

You’ll want to replace the hex color code with one of your own, though. Lets go a bit farther and setup some different styles for the links and hover actions.

a:link, a:visited {
color: #FFAACC;
text-decoration: none;
}
a:hover, a:active {
color: #EE99BB;
text-decoration: underline;
}

Here we have links that will change color when hovered over. They will appear by default without an underline, but when hovered over, the underline will appear. This makes the links a bit more interactive, and usually it helps visitors distinguish links from non-links.

3 Responses to "CSS: Change the default link style"

Thank You!!! I couldn’t get this answered from anyone. Such a huge help!

Thanks. It’s always the simplest things isn’t it?

Thanks for that! Concise, and exactly what I needed!

Leave a comment