Improve company productivity with a Business Account.Sign Up

  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 306
  • Last Modified:

CSS on hyperlinks

Just out of curiosity, is it possible to color a hyperlink (or regular text) a different color than the underline?  For instance, if I had a green hyperlink like so:

<a href="somepage.html" style="color:green;text-decoration:underline;">

The link text and the underline would be green.  Could I, say, make the underline blue?  Thanks
1 Solution
But what you can do is assign properties to the items in layers...

And no, I have not done it so don't ask me to do it for you...
jmtt13Author Commented:
Do you happen to know of a web site that might reference assigning properties in layers?  This sounds interesting.  Thanks  ;)
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

Look into the <ilayer> and <layer> tags, in NN the link is  For IE you can use the <div> tag and z-index refs in CSS.
why don't you do somehting a lot simpler and use images. Save them as gifs and they will be pathetically small.

IMHO this way is a lot simpler:-)

It does matter about the formatting tho'
The answer to your question is: in theory, yes.

You'll have to wrap the link in a SPAN though, and assign the underline color to the SPAN.  E.g:

<span class="blackLine"><a href="..."> ... </a></span>

and then:

<style type="text/css">
..blackLinke {
  text-decoration: underline;
  color: black;
  background: transparent;
..blackline a:link {
  color: red;
/* etc, etc */

You'll maybe have to add 'text-decoration: none;' to the link.

The underlining should be kept throughout the element, see for an example (although they don't use links).
jmtt13Author Commented:
This is just what I was looking for.  Thanks a bunch!
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to and use offer code ‘EXPERTS’ to get 10% off your first purchase.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now