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:

<A HREF="">Red Link</A>

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="">Example Link</A></FONT>
<FONT COLOR="green"><A HREF="">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=""><FONT COLOR="red">Example Link</FONT></A>
<A HREF=""><FONT COLOR="green">Example Link 2</FONT></A>

Which produces:

Example Link

Example Link 2



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.

<A STYLE="COLOR:GREEN;" HREF="">Example Link 2</A>

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


URL: (optional)


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

Guru Spotlight
Joe Wallace