How to Remove the Underline Under the Links in HTML/CSS?

Praveen Kumar Ganesan
Praveen Kumar Ganesan
Praveen Kumar Ganesan also called as GPKUMAR is the visionary Founder of Inavit Studio and Inavitnews, where technology meets storytelling. With a passion for innovation and...
1 Min Read

By default, HTML hyperlinks are underlined. However, if you wish to deactivate this feature and display your hyperlinks as non-underlined text, you can do so using the CSS.

This article will walk you through the necessary steps.

To remove the underline from HTML links, simply enter the following code in the CSS:

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

N.B. Pseudo-class: link allows you to target only the hyperlinks (<a href=””>) and anchors (<a name=””>) and is not compulsory.

If you want the style to apply to particular links, simply define a specific class for links that you wish not to be underlined. You may do so using the following code:

<style type="text/css">   
a.nounderline: link   
(   
Text-decoration: none;   
)   
</ style>   
<style type="text/css">  
a.nounderline:link  
{  
 text-decoration:none;  
}  
</style>

Finally, if you do not want to define a style sheet, you can simply set the style online with the following style attribute:

<a href="/" style="text-decoration:none">Text of link</a>

Share This Article
Praveen Kumar Ganesan also called as GPKUMAR is the visionary Founder of Inavit Studio and Inavitnews, where technology meets storytelling. With a passion for innovation and digital transformation, Praveen blends creativity with strategic thinking to craft compelling tech, gaming, and news content that resonates with a global audience.
0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Oldest
Newest Most Voted
0
Would love your thoughts, please comment.x
()
x