All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

Remove Underline From Link CSS

Last Updated : Mar 11, 2024

Remove Underline From Link CSS

In this tutorial we will show you the solution of remove underline from link CSS, when we create a link using anchor tag then it will show a formatted text on webpage which is blue in color and has an underline to it.

So, today the question is that is there any way in CSS which help of which we are able to remove underline from links. So, let’s see the example given below.

Step By Step Guide On Remove Underline From Link CSS :-

Now, as we already know that how to create a link in html using anchor tag.

So, we skip this step and let us see how to customize the text which is showed on browser using CSS.

For, this let us understand the example given below.

<!DOCTYPE html>
<html>
<head>
   <title> CSS tutorials </title>
 <style>
a {
    margin: 400px;
              text-decoration: none;
}
 </style>
</head>
<body>
<h1>
 Talker’sCode – CSS tutorials
</h1>
<h2>
 How to use background image in CSS
</h2>
<a>
 This is first link
</a>
<a>
 This is second link
</a>
<a>
 This is third link
</a>
</body>
</html>
  1. As, here we see that we that in above example we show you an example in which html and CSS codes are used.
  2. Let us understand the above codes step by step.
  3. Here, first of all we create a basic structure of html, in which we use <!DOCTYPE html> which defines the type of document. And next one is our html tags. These tags are paired tag and all the data regarding html is written inside these tags.
  4. After we use our head tag which is again paired tag and contains title and meta information of the webpage. The data written inside head is not showed on the webpage.
  5. Now, next is our title tag which defines the title of webpage. The tag which has its closing tag is known as paired tag. So, this is again paried tag.
  6. Now, next is body which is main tag of html. The data which we written inside body is showed in webpage. Mostly all tags which are helpful to show data or information on screen is written under body tag
  7. Now, as above in body we see that we create three anchor tags. When we see this code on browser screen. We see that the links are seen blue in color and underlined.
  8. To remove underline we only have to use text-decoration property and the value given to it must be none. Hence, the extra decoration applied to anchor tag that is underline gets removed and our link will appears without underline.

Conclusion :-

At last, in conclusion here we can say that with the help of this article we are able to understand about how to remove underline from link using css.

I hope this tutorial on remove underline from link CSS helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Anjali

Experienced Computer Programmer with a broad range of experience in technology. Strengths in application development and Object Oriented architecture design, front end programming, usability and multimedia technology. Expert in coding languages such as C, C++ Java, JavaScript, PHP and more.

Follow Anjali On Linkedin 🡪