Link without changing color or style

How do I create a link on a word without changing the color or style of the text? Usually applying <a> to the word applies the blue color and the underlining. Is there a way to prevent <a> from applying any visual changes to the word besides the cursor changing to a hand pointing.

Eg. Imagine my link style is:
a { color: orange } which makes a link look this

Now imagine I have a huge colored heading like this:
My cool heading

I want to make this a link but I don’t want it to be orange or underlined. How?
I can manage the underlined part, but what about color.

Eg. Is there something like:
.fooclass a { color: #leave it as it is#; text-decoration: none }

Nearly. Subclasses.

a.fooclass1 { blah blah }
a.fooclass2 { blah blah }


<a href=“blah” class=“fooclass1”>blah</a>
<a href=“blah” class=“fooclass2”>blah</a>



Or have I missed your question…? You can use subclasses to retain colour by making them the same as the colour of the text of course…

shouldn’t that be

a.fooclass:link { blah }
a.fooclass:visited {blah }


Shouldn’t need it unless you want to specify a different visited colour, etc… I think…

I think you missed my question. I’ll try to give a more clear example.

Here is a black bold heading:

When you wrap a link around it, it turns blue and becomes underlined, right?
<h1><a href=“foo.html”>Test</a></h1>

Now how do I prevent <a> from changing the color of the black <h1> heading?

WAIT! You’re going to say, that’s easy! All you need to do is:
h1 a { color: black; text-decoration: none } and it will look the same right?

This is not what I want though. I want you to assume you don’t know what color the text in the <h1> fields are. In my real scenario, the text is multiple colors so applying a single color to <a> will not help.

Is there a solution? I simple want to tell <a> not to apply a new color, delete it’s color value, etc.

Ahhhhh!! Got you! Um… :frowning:

No idea.

i have an idea but you may not like it

if you’re going to “hide” the fact that it’s a link, the easiest way to do that is not to make it a link

why are you doing it, anyway? search engine spamming, er, i mean, optimization?

if you need a link, make it a link

if you need a heading to be a link, make it a link

otherwise, don’t bother, ‘cause nobody’s a-gonna be clickin’ on nothin’ that don’t look like a link nohow

You use multiple <span> for each letter assigned a different colour if you want the rainbow effect and set the background-color to transparent.

But basically there is no automatic way for it to dectect the background colour.

Alternatively there is the option of using CSS inherit if you just wanted it to match the parent colour, again this fails in M$ Explorer.

<style type=“text/css”>
<!– {color: red;}
a:link {color: inherit; text-decoration: underline; font-weight: bold;}

<p class=“red”>Lorem Ipsum<a href=“#”> Look I’m Red </a>Like my Parent.</p>

I must be rusty from the Christmas break.

Yeah seen that, tried that. No good for my needs unfortunately.

I’ll accept there is no answer and just do it the hard and ugly way.