How to underline text in HTML?

HTML is the backbone of the web, and knowing how to format text in HTML is a fundamental skill for anyone creating web content. Underlining text is a simple but effective way to emphasize words or phrases in your content. In this blog post, we will walk you through two ways of underlining text in HTML, including the plain HTML tags and CSS rules you can use to achieve this formatting effect.

How to underline text in HTML?

To underline text in plain HTML you can use <u> tag which stands for underline. By default, browsers render text wrapped in this tag as underlined. You can see the use of this tag in the example below:

<u>Underlined text</u>

How to underline text with CSS?

Except for using an HTML tag, you can always use CSS to indicate some text which should be underlined. To achieve this you need to use text-decoration CSS rule with underline value, like in the example below:

<p>Some text to underline</p>
p {
  text-decoration: underline;

or you can use inline styles:

<p style="text-decoration: undeline;">Some text to underline</p>


Underlining text in HTML is very straightforward, you can do this in plain HTML by using semantic tag or in CSS styles by styling inline text you want to underline. Which of the above methods you choose depends on what you need, but there is no better or worse approach to underlining text.

Leave a Reply

Your email address will not be published. Required fields are marked *