WordPress.org

1. Dave91
   Member
   Posted 4 years ago #

   Hi everyone,
   Just wondering if somebody could help me change the colour of a link on my site. Just an individual link.
   I understand that I have to add some code to the css. But i dont know what code and the code that i did find wont work.

   Hope someone can help. I want the link to show white.

   Thanks again,
   Dave

   http://www.davesblogidge.com

2. Dave91
   Member
   Posted 4 years ago #

   I added this:

   .body2 A:link {color: #0000CC; text-decoration: underline overline}
   .body2 A:visited {color: #0000CC; text-decoration: underline overline}
   .body2 A:active {color: #0000CC; text-decoration: underline overline}
   .body2 A:hover {color: #0000CC; text-decoration: underline; color: green;}

   to my style.css file.
   and used the tags <span class="body2"> to show that css for the links but its shows no difference.

   could someone please tell me what im doing wrong... :(

3. Dave91
   Member
   Posted 4 years ago #

   Anyone? :(

4. nolageek
   Member
   Posted 4 years ago #

   what color is your regular link?

5. Dave91
   Member
   Posted 4 years ago #

   The color of the original link is a blue. But i dont want to change that, i just want to change the colour of one indiviual link.

   Thanks,
   Dave

6. doodlebee
   Member
   Posted 4 years ago #

   *which* link is it? Well, I guess it doesn't matter, as the site's not coming up. But I see a few errors in your line of thought.

   #1, your stylesheet calls are "A:link" instead of "a:link" - it's case-sensitive. So if you're calling in your links with "a", then it won't apply the "A" rule.

   #2, your stylesheet links structure is out of order. (Yes, it has to be in a certain order to function properly.) Remember the "LoVe HAte" rule: :link, :visited, :hover, :active.

   #3, don't call something in twice, it's bad form (your hover color is defined twice).

   #4, no need for the extra markup. Just apply it directly to your "a" tag - no span necessary. So the stylesheet should be:

   a.body2, a.body2:link, a.body2:visited {
   color: #0000CC;
   text-decoration: underline overline;
   }
   
   a.body2 hover {
   color:green;
   }
   
   a.body2:active {
   color: #0000CC;
   }

   and the markup within the post should be:

   <a class="body2" href="URL here">text here</a>

7. Dave91
   Member
   Posted 4 years ago #

   First off, Thank you VERY VERY much for helping me with this. Another thing, what do you mean by my site not showing... It wasnt down today was it?

8. doodlebee
   Member
   Posted 4 years ago #

   must have been - I tried to see it at the time I wrote that post, but it wouldn't come up (about 10 am EST) - server was down.

9. nolageek
   Member
   Posted 4 years ago #

   Also, if you just want to change it for that one link, just do it inline:

   <a style="color:green" href="blah.html">Link Text</a>

   or

   <a href="blah.html"><span style="color:green">Link Text<span></a>

   or

   <a href="blah.html"><font color="green">Link Text</font></a>

   I'm pretty sure one of those will work. (Been a while, but I've done it!)

Topic Closed

This topic has been closed to new replies.