Logo - ProgrammingHead

Remove Underline from link HTML

Hi there, in This tutorial we are going to remove underline from links by Using CSS in HTML. So follow along and we will also cover other related questions to this (Remove underline from link) Topic.

Remove Underline from link HTML [Updated 2025]

Using CSS to remove underline from link in HTML

using CSS text-decoration:none; property we can easily remove underline from HTML links.
So we have to write add this text-decoration:none; to our Anchor/Link tag as shown below.

Using Inline CSS

all you need is this CSS property text-decoration:none; .
To use InlineCSS we need write style=" " attribute to our Anchor/link starting tag.
Then we can use text-decoration:none; property inside style=" " attrubute like this
style="text-decoration:none;"

index.html

<a href="#">With Underline</a><br/>
<a href="#" style="text-decoration:none;">Without Underline</a>

Results

Using External or Internal CSS

If you are using external CSS or internal CSS then use this text-decoration:none; we need to select the link/anchor tag first.
We can select that using Tag ID or just by TAG NAME a{…}.
And we can use text-decoration:none; CSS like shown below.

style.css

a{
  text-decoration:none;  
}

Results

Related Topics: Remove Underline from link HTML [Updated 2025]

Click on Titles below to reveal the Data

Remove the blue color with underline form HTML link

To remove the default blue color from link just use CSS color:black; property.
Where you can choose any color like green, yellow, pink, gray, lightgray and more.

index.html [Inline CSS]

<a href="#" style="text-decoration:none; color:black;">Click Me</a>

Results

style.css [internal or External CSS]

a{
    text-decoration:none;
    color:black;
}

Results

How to remove the underline from the link in HTML without CSS

you can use Pure JavaScript or JQuery.
Pure JavaScript is good but its hard to select multiple Elements with that You have to use LOOP just for that.
So if you have only one LINK, then use Pure JavaScript But for Multiple Links you have to use jQuery.

my.js [With Tag Name]

document.getElementsByTagName("a")[0].style.textDecoration = "none";

my.js [With Element ID]

document.getElementById("mylink").style.textDecoration = "none";

my.js [Jquery]

$(document).ready(function() {  
    $("a").css({"text-decoration": "none"});  
});

text-decoration none html

In HTML, text-decoration none (text-decoration:none;) removes all the Text element stylings like Underlines.
So if you want to remove Underlines from Links you can use this text-decoration:none; CSS property to get rid of that underline from the texts/links.

index.html

<a href="#" style="text-decoration: none;">Click Me</a>