How to Underline Text in HTML?

Underlining a text is one of the most basic operations when writing a sentence, paragraph, or heading. We can use it to represent or highlight a critical or incorrect word.

In HTML, there are mainly two methods of doing it.

• Using the <u> tag.
• Using the text-decoration CSS property.

Let us explore each of these methods with the help of an example.

Transform Your Career

Choose from our industry-leading programs designed for career success

NSDC Certified

Modern Software and AI Engineering Program

Master full-stack development with AI integration

12 MonthsDuration

AI-LedCurriculum

Career SupportSupport

+1000 more

Go to Program

NSDC Certified

Modern Data Science and ML with specialisation in AI

Advanced data science techniques with AI specialization

12 MonthsDuration

AI-LedCurriculum

Career SupportSupport

+1000 more

Go to Program

NSDC Certified

Advanced AIML with Specialisation in Agentic AI

Deep dive into AIML with focus on Agentic systems

12 MonthsDuration

AI-LedCurriculum

Career SupportSupport

+1000 more

Go to Program

NSDC Certified

DevOps, Cloud & AI Platform Engineering

Build and manage AI-powered cloud infrastructure

12 MonthsDuration

AI-LedCurriculum

Career SupportSupport

+1000 more

Go to Program

NSDC Certified

AI Engineering Advanced Certification by IIT-Roorkee

Premier AI engineering certification from IIT-Roorkee

3 MonthsDuration

AI-LedCurriculum

Career SupportSupport

Go to Program

Text Decoration Using The <u> Tag

The <u> tag stands for Unarticulated Annotation element. It was used in the earlier version of HTML to underline text.

Syntax:

Example:

Code:

Output:

I am happy to read this article.

Explaination

<u> was removed in HTML 4.01 and then reloaded again in HTML5 to highlight text that should be different from the normal text in terms of style. It is a semantic element and should be used only for specific purposes like underlining a spelling mistake or writing proper Chinese names but not for styling purposes.

It supports Global Attributes and Event Attributes in HTML.

Whenever using the <u> tag, ensure that you do not confuse the reader between hyperlinks and underlined texts. We should use <cite> tag in place of <u> tag when we want to highlight a book or paper title.

Text Decoration Using text-Decoration CSS Property

Another way to underline a text is to use the "text-decoration" property in CSS.

Syntax:

Example:

Code:

Output:

Text underlined using "text-decoration" property.

It is recommended to use the text-decoration CSS property to underline text as it provides custom styling options and works on all browsers.

Hiring Partners:

GoogleAmazonMicrosoftFlipkartAdobe1200+ more

Example:

Code:

Output:

Text underlined using custom "text-decoration" property.

Learn More

• To learn more about the HTML tags and how to use the HTML tags while creating the web pages refer HTML Tag - Scaler Topics.
• To know what are the available tags in the HTML you can refer to Lists of HTML tags - Scaler Topics