All TalkersCode Topics

Follow TalkersCode On Social Media

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

How To Underline Text In HTML

Last Updated : Mar 11, 2024

How To Underline Text In HTML

In this tutorial we will show you the solution of how to underline text in HTML, in html sometimes we want to make text underlined, with some colors or without colors also. This can be done in many ways in html.

The underline text looks like important text and also highlighted. So, the underline is used by some programmer to looks text more attractive.

Hence, there are some ways with the help of which you are able to make text underlined. We hope that you will understand them properly.

Step By Step Guide On How To Underline Text In HTML :-

Now, there are many ways to make the text underlined, some of them are:

  • With the help of u (underline) text.
  • With the help of border-bottom

Hence, there are most used two ways to make the text underlined. The u is known as underlined this tag is inbuilt tag of html to make text underlined.

Where the border-bottom tag is used to make a border at the bottom of text which looks like the text in underlined

<!DOCTYPE html>
      <html>
        <head>
          <title> Title of the document<title>
	  </head>
	  <body>
<p>
        <u>
            this text is underlined. you can write anything here, which automatically becomes underlined when you see on browser.
        </u >
    </p>
    <div style="border-bottom: 2px solid black ; width:max-content;">
        you can use any tag to make a border bottom in html , that may be div, paragraph, heading and b tag also.
    </div>
	</body>
      </html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
  4. Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here. In the body tag, we make a paragraph and a division, you can use any tag which you want here.
  5. In first that is paragraph, we use u tag. The u tag is known as underlined tag and it automatically makes the text underlined.
  6. It is a paired tag and you just have to write the text which you want to make underline.
  7. In next we make a div and give it border bottom. The border bottom create a line under the element in this you have to specify the weight of line in pixels and the border style with border color.
  8. So, with this help you are able to make a line under the text, you can use any tag and replace the div here.
  9. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

In conclusion, we can say that we are able to make the text underline here with the help of different ways.

The most used tag in u that is underline tag. You can use this tag anywhere because if you want to make a small part underlined in any paragraph then this is used.

I hope this tutorial on how to underline text in HTML helps you and the steps and method mentioned above is easy to follow and implement.

Author Image About Amruta

Amruta is an Experienced web developer with 4 years for experience she completed her master's with MCA and passionate about programming Languages for creating technical contents like HTML, CSS, JavaScript, Java, Python, PHP, jQuery.

Follow Amruta On Linkedin 🡪