Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
September 21, 2021 01:39 pm GMT

How to Remove Underlines From Links with CSS

You know how hyperlinks always come with an underline, right? And you want to get rid of it so you can add your style. Well, you can do it by using the text-decoration property.

text-decoration is a CSS property that will specify how to decorate the text. Since the hyperlink by default has a decoration, all you have to do is remove the text-decoration from the link.

An example code

Let us take an example of how to remove underline with the text-decoration property.

<!DOCTYPE html><html lang="en">  <head>    <meta charset="UTF-8" />    <meta http-equiv="X-UA-Compatible" content="IE=edge" />    <meta name="viewport" content="width=device-width, initial-scale=1.0" />    <title>Example</title>  </head>  <body>    <a href="#">Definitely not a clickbait</a>    <style>      a {        text-decoration: none;      }    </style>  </body></html>

As shown from the example code above, the text-decoration: none; basically tells the CSS not to have any decoration on the hyperlink. That means the hyperlink no longer has an underline.

And that is pretty much of it. Quite simple, right?

Get my free e-book to prepare for the technical interview or start to Learn Full-Stack JavaScript


Original Link: https://dev.to/coderslang/how-to-remove-underlines-from-links-with-css-42kk

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To