How To Add/Remove Underline To/From Html Text Examples

This article will tell you how to add underline to or remove underline from Html text with some examples.

Table of Contents

1. How To Add Underline To Html Text.

You can use the Html <u></u> tag to add underline to Html text.
```
<u>Add underline by the html u tag.</u>
```

You can use the CSS style text-decoration attribute to add underline to the Html text.

<span style = "text-decoration: underline;">Add underline by the text-decoration style.</span>

You can also define a CSS style sheet as below, and then use the style sheet to the Html elements that you want to add underline to the Html element content.
```
<style> 
   .under-line{
      
      text-decoration:underline
      
   } 
</style>

<div class="under-line">Add underline by CSS class</div>
```

Below is the full Html source code that demonstrates how to add underline to Html text.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Add / Remove Underline To / From Html Text Example</title>

<style>

   /* define a css style class. */
   .under-line{
      
      text-decoration:underline
      
   } 
   
</style> 
 
</head>
<body>

<u>Add underline by the html u tag.</u>

<br/>

<span style = "text-decoration: underline;">Add underline by the text-decoration style.</span>

<br/>

<div class="under-line">Add underline by CSS class</div> 

<br/>

</body>
</html>

2. How To Remove Underline From Html Text.

If you want to remove the Html text underline for example remove the underline of the hyperlink text ( the content of the Html a tag ), you can set the CSS text-decoration attribute to none.

In the below example source code, we define the CSS style for the Html tags a, then all the hyperlinks in the Html page will do not show the underline.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Add / Remove Underline To / From Html Text Example</title>

<style>
   
   /* define the css style for Html a tag. */
   a{
      text-decoration:none
   }

</style> 
 
</head>
<body>

<a href='https://www.dev2qa.com'>dev2qa.com</a>

<br/>

</body>
</html>

1. How To Add Underline To Html Text.

2. How To Remove Underline From Html Text.

Leave a Comment Cancel Reply