How to remove underlines from my links with CSS

The default indication that text on a Web page is a link to another document is that it’s underlined and is a different color from the rest of the text.  If you want to remove that underline you can use the text-decoration property to remove it. By default, the browser sets the text-decoration of an <a> tag to underline. To remove the underline, simply set the following property for the link:

text-decoration: none;

You can use the following CSS code:

 

a:link, a:visited {

text-decoration: none;

}

 

You can use in addition to underline and none, there are other values for text-decoration:

– overline

– line-through

– blink

You can also combine these values. If you want to have an underline and overline on a particular link, you’d use the following code:

a:link, a:visited {

text-decoration: underline overline;

}

 

Important note:

Underlining links is a standard convention followed by all Web browsers and, consequently, users expect to see links underlined. Removing the underline from links that are within text can make it very difficult for people to realize that these words are in fact links—not just highlighted text.