Inline CSS for anchor tag and hover

Question

I'm under the impression that changing an anchor tag on hover can be done like this:

a:hover {background: #FFDD00;}
a:hover {color: #AAAAAA;}

Correct me if I'm wrong.

Now, for some convoluted reason, I can't put that code in a style sheet, I have to put it in the actual HTML. How would I do that?

<a href="..." style="___???___">...</a> 

Answer 1

If you can't toss your hover CSS into a tag, then the best way to handle this is going to be JavaScript. I wouldn't ordinarily call this a good approach, but it sounds like your hands are tied here.

<a href="..."
   onmouseover="this.style.backgroundColor='#ffdd00';this.style.color='#aaaaaa'"
   onmouseout="this.style.backgroundColor='transparent';this.style.color='inherit'">
...
</a>

Hope that works for you!

Answer 2

I'm pretty sure you can't apply psudo-classes inline, but you can do this with javascript inline.

e.g.

<a href="..." onmouseover="this.style.color = 'red'" onmouseout="this.style.color = 'black'">...</a>