Use CSS to remove the underline from the link in HTML. In CSS set the property “text-decoration” to “none”.
Examples of Remove underline from link CSS
Here is simple examples of it:-
Inline CSS Example
Just add text-decoration:none; to a tag for #none: Use it with the style attribute
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<a href="http://yoursite.com/" style="text-decoration:none">yoursite</a>
</div>
</body>
</html>
Output:
Internal CSS Example
Try this, add a id(or class) to your a href
<a href="http://www.EyeHunt.com/" id="thisLink" target="_blank" rel="noopener noreferrer">EyeHunt.com</a>
Below code belongs in the <head> of your document or in a stylesheet:
<style type="text/css">
#thisLink{
text-decoration: none;
}
</style>Complete Example
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#thisLink{
text-decoration: none;
}
</style>
</head>
<body>
<a href="http://www.EyeHunt.com/" id="thisLink" target="_blank" rel="noopener noreferrer">EyeHunt.com</a>
</div>
</body>
</html>Output:
Q: How to remove the underline from a link in HTML?
Code for remove all underlines from all links:
a {text-decoration: none; }If you Want to Remove the underline of specific links then apply this to, give them a class name, like nounderline and do this:
a.inkNoLine{text-decoration: none; }It will apply only to same class name links and leave all others unaffected.
Do comment if you have any doubts and suggestions on this topic.
Note: The All HTML Examples codes are tested on the Firefox browser and the Chrome browser.
OS: Windows 10
Code: HTML 5 Version