How to remove underline from a link in HTML

Question

In my page I have put some links under which I don t want any line  so  how can I remove that using HTML

User · Answer

This will remove all underlines from all links:

a {text-decoration: none; }

If you have specific links that you want to apply this to, give them a class name, like nounderline and do this:

a.nounderline {text-decoration: none; }

That will apply only to those links and leave all others unaffected.

This code belongs in the <head> of your document or in a stylesheet:

<head>
    <style type="text/css">
        a.nounderline {text-decoration: none; }
    </style>
</head>

And in the body:

<a href="#" class="nounderline">Link</a>

User · Answer

All the above-mentioned code did not work for me  When I dig into the problem I realize that it was not working because I d placed the style after the href  When I placed the style before the href it was working as expected    lt a style  text-decoration none  href  http   yoursite com   gt yoursite lt  a gt

User · Answer

Add this to your external style sheet  preferred    a  text-decoration none    Or add this to the  lt head gt  of your HTML document    lt style type  text css  gt   a  text-decoration none    lt  style gt   Or add it to the a element itself  not recommended     lt  -- Add   style  text-decoration none    -- gt   lt a href  http   example com  style  text-decoration none   gt Text lt  a gt

User · Answer

lt style  text-decoration  none  gt    The above code will be enough Just paste this into the link you want to remove underline from

User · Answer

The other answers all mention text-decoration  Sometimes you use a Wordpress theme or someone else s CSS where links are underlined by other methods  so that text-decoration  none won t turn off the underlining   Border and box-shadow are two other methods I m aware of for underlining links  To turn these off   border  none    and  box-shadow  none

User · Answer

Inline version    lt a href  http   yoursite com   style  text-decoration none  gt yoursite lt  a gt    However remember that you should generally separate the content of your website  which is HTML   from the presentation  which is CSS   Therefore you should generally avoid inline styles   See John s answer to see equivalent answer using CSS

User · Answer

I suggest to use  hover to avoid underline if mouse pointer is over an anchor  a hover      text-decoration none

User · Answer

The following is not a best practice  but can sometimes prove useful  It is better to use the solution provided by John Conde  but sometimes  using external CSS is impossible  So you can add the following to your HTML tag     lt a style  text-decoration none   gt My Link lt  a gt

[html] How to remove underline from a link in HTML?

Examples related to html