Monday, September 20, 2010

How to get HTML link or anchor tag without underline

by Emmaneale Mendu, Web Developer
Basic anchor or link code looks like this
<a href="http://www.cooltuts.com/">Visit Cooltuts.com</a>

On Web browser this looks like
Visit Cooltuts.com

Let’s work with style property to remove the Underline to the link; basically if the text is underlined then by default user thinks it’s a link. But in some cases the requirement will be without underline.
We use “text-decoration” to overcome this issue. This is a style property we do have none|inherit|combination of ‘underline’,’overline’,’line-through’ and ‘blink’

Properties

style="text-decoration:none" (remove complete decoration like underline)
style="text-decoration:underline"
style="text-decoration:overline"
style="text-decoration:line-through"
style="text-decoration:blink" (wont work in IE but works in Mozila)

If you are using style="text-decoration:none"

<a href="http://www.cooltuts.com/" style="text-decoration:none">Visit Cooltuts.com</a>

Output looks like
Visit Cooltuts.com

No comments:

Post a Comment