CodeOverload
CodeOverload

Reputation: 48565

How to disable automatic links coloring without selecting a color?

this is really confusing, i don't want the browser to change the color of links, so the links color will stay same as specified in <font> . i know that i can specify a color with the property A:link , but that's not what i want.

Thanks

Upvotes: 54

Views: 105866

Answers (4)

simaofreitas
simaofreitas

Reputation: 1415

If you don't want any coloration just do something like this:

a, a:hover, a:visited, a:active {
  color: inherit;
  text-decoration: none;
 }

Upvotes: 122

Vance C.
Vance C.

Reputation: 21

If anyone cares this is what I did with buttons that I made from the links. Probably have to watch out for the inheritance but it worked perfect in my case. Good luck!

HTML:

<a class="button blue" href="/">Place Your Order Today</a>

CSS:

a.button:visited
{
 color:inherit;
}
.button
{
 padding: 6px 8px;
 font-size: 14px;
 font-weight: bold;
 text-decoration: none;
 margin-right: 10px;
 border-radius: 6px;
}
.blue
{
 border: 1px solid #2d748c;
 background-color: #40b5dc;
}

Upvotes: 2

jpsimons
jpsimons

Reputation: 28130

I'm pretty sure there's no way to do what you're describing. But if you want the link color to match the body text color, I'd recommend this...

The body text color came from somewhere. Probably a CSS definition. Inspect some text in Firebug to see exactly where the applied color was defined. For example, maybe it points you to a rule like this:

body { color:#666; }

Just add in your A tag right there, so it would be like this. I know it's redundant but I really don't think CSS has a way to say "inherit from one level higher in the cascade than you usually would."

body, a { color:#666; }

Upvotes: -2

ЯegDwight
ЯegDwight

Reputation: 25257

Specify the same color for a:visited and maybe also a:hover and a:active or simply put the color inline like this:

<a href="url" style="color:#69c">link text</a>

<font> is deprecated anyway.

Upvotes: 1

Related Questions