Underline Tag in HTML

Learn via video course
FREE
View all courses
JavaScript Course With Certification: Unlocking the Power of JavaScript
JavaScript Course With Certification: Unlocking the Power of JavaScript
by Mrinal Bhattacharya
1000
4.8
Start Learning
JavaScript Course With Certification: Unlocking the Power of JavaScript
JavaScript Course With Certification: Unlocking the Power of JavaScript
by Mrinal Bhattacharya
1000
4.8
Start Learning
Topics Covered

Overview

HTML provides various styling options for the text. One of them is underlining the texts or using underline tags in HTML. You can achieve similar results in underlying the text with the help of CSS, and that approach is also discussed in this article.

Introduction

There is an underline tag in HTML, i.e. <u> tag, which is used to underline any piece of text. The underline tag in HTML was deprecated in HTML4. However, it was reintroduced in the HTML5 with the semantic meaning. In HTML5, it is used to indicate that a span of inline text has a non-textual meaning.

Syntax of Underline Tag in HTML

Example:

Attributes

There are no attributes that are specific to the underline tag in HTML, i.e. <u> tag. This element includes only global attributes, and some are listed below :

  • accesskey
  • autofocus
  • class
  • draggable
  • hidden
  • id
  • inputmode
  • lang
  • part, etc.

What Is The Underline Tag Used For?

The underline tag in HTML, i.e. <u> tag, was originally used to underline the text in the HTML, but the element was deprecated in HTML 4.01. Because the usage of HTML for styling effects isn't a good practice anymore, instead, the HTML should be used for adding structure to the web page and semantic meaning.

Now, in HTML5, the underline tag in HTML, i.e. <u> tag, has a semantic meaning, and it represents the span of an inline text that indicates it has a non-textual annotation.

For example, you can use the <u> element to identify misspelled terms. Generally, browsers render the text found within the <u> tag as an underlined text.

Example:

The output of the above code is shown below:

Output:

Output of underline tag

Note:

The text inside the underline tag in HTML, i.e. <u> tag, is underlined unless you style it otherwise using CSS. This element should not be used to underline the texts in HTML because it is a deprecated tag and reintroduced in HTML5 with the new semantic meaning. To underline the text, use the CSS text-decoration property.

Examples of Underline Tag in HTML

You can use the HTML <u> tag in different ways and some of which are mentioned below with examples.

  • Simple example of underline tag in HTML:

    Output:

    Output of u tag in the example

  • Indicating a spelling error:

    Output:

    Output of u tag having spelling mistake

  • Alternate way of the underline tag to underline the text:

    As discussed above, if you want to underline the text, you can use the CSS property. Do not use the <u> tag to include the underline on any text.

    Output:

    Output of underline tag applied through CSS

Browser Support

  • Google Chrome
  • Firefox
  • Safari
  • Internet Explorer
  • Edge

Conclusion

  • The underline tag in HTML, i.e. <u> tag, was originally used to underline the text in the HTML 4.01.
  • In HTML5, the <u> tag was reintroduced with the new semantic meaning.
  • In HTML5, the <u> tag has a semantic meaning, and it represents the span of an inline text that indicates it has a non-textual annotation.
  • The <u> element in HTML does not have any specific attributes. It includes only global attribute