Changing the color of a single link

Read this tip to make your life smarter, better, faster and wiser. LifeTips is the place to go when you need to know about Tricks & Shortcuts and other Html topics.

How do I change the color of only one link?

Changing the color of a single link

Controlling the color of links on a web page is easy using the LINK and VLINK attributes of the BODY tag, as follows:

<BODY LINK="RED" VLINK="RED">
<A HREF="http://www.html-tips.com">Red Link</A>
</BODY>

But what if you want several links to have different colors? The logical approach is to use the FONT tag, in this manner:

<FONT COLOR="red"><A HREF="http://www.html-tips.com">Example Link</A></FONT>
<BR>
<FONT COLOR="green"><A HREF="http://www.html-tips.com">Example Link 2</A></FONT>

But here is what it produces:

Example Link

Example Link 2

Now here is the correct way to achieve the desired result:

<A HREF="http://www.html-tips.com"><FONT COLOR="red">Example Link</FONT></A>
<BR>
<A HREF="http://www.html-tips.com"><FONT COLOR="green">Example Link 2</FONT></A>

Which produces:

Example Link

Example Link 2

   

Comments

12/11/2007 4:38:43 AM
wohombIrram said:

I’d prefer reading in my native language, because my knowledge of your languange is no so well. But it was interesting!


5/5/2011 11:50:51 AM
KeeBlitz said:

Another method instead of adding the FONT tag you can define more options within your <A> tag by using the style definition.

Example:
<A STYLE="COLOR:GREEN;" HREF="http://www.html-tips.com">Example Link 2</A>

This method allows you some other definition options for the presentation of your link.




Name:


URL: (optional)


Comment:


Not finding the advice and tips you need on this Html Tip Site? Request a Tip Now!


Guru Spotlight
Christina Chan