Different link colors on same page

User 423201 Photo


Registered User
1 post

Is there a way to have different link colors for different text links on the same page. I have different text colors in different sections on my pages and would like the links to match up with the text color. Is this possible??
User 355448 Photo


Ambassador
3,144 posts

First, you may want to click on profile, and change your forum name to something other than your email address. This is a public forum and spammers are always looking for valid email addresses.

You can style anything on your website using CSS and even have green links at the top, blue links in the middle, and red links at the bottom.

There are likely many ways to do this, but the method I would use for a single page would be to put the style statements in a style section in the head of the code, and put code in the link itself to use the specific style. It is probably easier to show than to explain.

I will have to work with the code, but here is a link to an online reference: http://www.w3schools.com/CSS/css_pseudo_classes.asp

That link should get you started. Let me know if you need more help, and I will be looking at the references to get specific code.
User 355448 Photo


Ambassador
3,144 posts

Here is something you can try:

In the head section of your code, enter this:
<style type="text/css">
a.bkgn1 {color: #ffff00}
a.bkgn2 {color: #00ff00}
a.bkgn3 {color: #ff0000}
a.bkgn4 {color: #ff5555}
</style>

Then in the body of your code, enter this:
<a class="bkgn1" href="http://www.mysite1.com">site1</a>
<a class="bkgn2" href="http://www.mysite2.com">site2</a>
<a class="bkgn3" href="http://www.mysite3.com">site3</a>
<a class="bkgn4" href="http://www.mysite4.com">site4</a>

The first one is yellow, and may be hard to see, but you can change the colors to suit your needs.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.