0

I am trying to modify the link color inside a <span>. (I know that this is not optimal/conforming, but I am stuck in a situation where I don't have access to the header and also cannot play with the <a> tags.) I tried something like this, which doesn't work

<span style="a {color:#C04040} ">
Try to change in a &lt;span&gt;: <a href="http://nonesuch">This link</a>
</span>

I also tried other variations, like:

<span style="a.color:#C04040">

I admit that I don't understand the syntax of <style> as a tag, as opposed to inside the header. Would appreciate any help, or links to complete documentation.

Thanks!

4
  • 1
    What header? Do you mean inside the head element? Style elements can be used anywhere.
    – isherwood
    Feb 7 at 20:24
  • The style attribute accepts properties and values, not selectors. A style element accepts selectors with associated properties and values in a brace block. There are plenty of tutorials out there which address this.
    – isherwood
    Feb 7 at 20:27
  • Anchor tags, are a special case, in that they have "pseudo" states, and you can not set the properties of those pseudo states inline for an anchor tag, and you certainly can't set them in a parent element. It actually makes no sense why you would be able to change the markup of your code, yet, unable to change the page header, but let's assume that there's some hurdles in your way you are trying to work around, perhaps because there's a template in place. You should look for existing .css files being included and change those.
    – gview
    Feb 7 at 20:43
  • If it's some sort of cms, that will let you add static html blocks, you could also get around it by have a <style></style> in the page that sets the anchor pseudo states the way you want them, but you are in the process making an invalid html page, even though it will work.
    – gview
    Feb 7 at 20:45

1 Answer 1

1

If you want to apply this rule to all your span tags, you can just place this in the content of your html document. Then all tags inside a span tag will get red with blue background.

<style> 
span a { color:red; background-color:blue; }
</style>

If you want to apply this only to a specific span tag, just use a named class like

<style> 
span.colorlink a { color:red; background-color:blue; }
</style>

And then you can do <span class='colorlink> for the spans you want colored.

2
  • Right, but I always thought that a style tag should be placed in the header. But then I checked the w3c standard and there are no such requirement. So I rewrote my answer
    – MTilsted
    Feb 7 at 22:15
  • Should, if only for good document organization. In more than 20 years of development it's never been a problem for me. You see it everywhere, especially on CMS sites. And head, not header. Headers are something else. Documents have heads and bodies. :)
    – isherwood
    Feb 7 at 22:17

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.