Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Changing <a> link underline color

I wonder if there is any trick to solve this problem.

I have my link as below text and want to change the underline color.

This link contains in many lines which needs to change the underline color to be lighter than the existing one

Using border bottom is not the way to solve this because multiple lines.

are there any trick to solve this?

EDIT

@Paolo Bergantino: It works with IE8 , is it possible to hack with IE6,7?

like image 480
pang Avatar asked Jul 24 '09 01:07

pang


People also ask

How do I change the link text color?

To change the color of hyperlink text, click Hyperlink, and then click More Colors. To change the color of the followed hyperlink text, click Followed Hyperlink, and then click More Colors.

How do you change underline in HTML?

To underline a text in HTML, use the <u> tag. The <u> tag deprecated in HTML, but then re-introduced in HTML5. Now it represents a text different from another text stylistically, such as a misspelled word.

Can you change hyperlink color in CSS?

Changing link color on hover using CSS To change the color of your link on hover, use the :hover pseudo property on the link's class and give it a different color.


1 Answers

If what you mean is a different underline color than what the text is, the only thing I can think of is to add a span around the link:

<span class='underline'>     <a href="#">this just<br>a test<br>of underline color</a> </span> 

And then the CSS:

span.underline {      color: red;      text-decoration: underline;  }  span.underline a {      color: blue;      text-decoration: none;  }  

And you get what you want.

EDIT:

Testing this a little further, it is not working for me on IE. If you add border-bottom, however, it surprisingly does work in all browsers, except that IE does not put a border under the last one. I will try to dig a little deeper to see if there's a cross-browser way to do this...

like image 78
Paolo Bergantino Avatar answered Sep 25 '22 20:09

Paolo Bergantino