DEV Community

Cover image for How to remove underline in <a href=""> tag.
Subhransu Patra
Subhransu Patra

Posted on

How to remove underline in <a href=""> tag.

#basics #html #css #frontenddeveloper 
<p>Hello</p>
Enter fullscreen mode Exit fullscreen mode

Previous Chapter Chapter 2

Inform Our World Link here

<a> tag, an essential tag for web development. This is the only way (as I thought) to add hyperlinks to website. This tag plays a main role to make a NavBar and that in turn plays an important role in web-development. Many of my website or all of my website have a navbar in turn have a <a> tag.

But there is a problem in <a> tag. When you implement it such as

<a href="#">Hello</a>
Enter fullscreen mode Exit fullscreen mode

Underlined hyperlink

Then the output text would have an underline. It is useful because we can distinguish between a hyperlink and a text. But when you want to create your own method of distinguishing, it is very much terrible to look with undrline text.

So, to prevent underline hyperlink, implement the following...

<style>
a {
color: /* Choose any */;
text-decoration: none;
}
</style>

<body>
<a href="#">Some Text...</a>
</body>
Enter fullscreen mode Exit fullscreen mode

No Underline

After implementing, the hyperlink will have no underline.

Thanks for Reading 😇

Top comments (2)

Collapse
 
gamerseo profile image
Gamerseo •

quite simple but good tutorial

Collapse
 
subhransuindia profile image
Subhransu Patra •

Thanks for your review. I will be bringing more post about HTML, CSS and JS soon! Do check out out my previous posts and my website also 😀.

Read next

codingdudecom profile image

Scrolling Text Using HTML

codingdudecom -

jess profile image

Join us for the next Frontend Challenge: Space Edition 👾🪐👽

Jess Lee -

arjuncodess profile image

Interactive Solar System Exploration with CSS & JavaScript

Arjun Vijay Prakash -

mroman7 profile image

Write less CSS using :is(), :where(), and :has() pseudo-classes

Roman -