HTML: <u> tag
This HTML tutorial explains how to use the HTML element called the <u> tag with syntax and examples.
Description
The HTML <u> tag defines text that should be styled differently or have a non-textual annotation. Browsers traditionally render the text found within the <u> tag as underlined text. This tag is also commonly referred to as the <u> element.
TIP: If you wish to underline text, you should use CSS such as the
text-decoration property instead of the <u> tag. Be careful to make sure that your underlined text is not confused with a hyperlink.
Syntax
In HTML, the syntax for the <u> tag is:
<body>
<p><u>Differently stylized text goes here</u> and not here</p>
</body>
Sample Output
Attributes
Only the Global Attributes apply to the <u> tag. There are no attributes that are specific to the <u> tag.
Note
- The HTML <u> element is found within the <body> tag.
- The <u> tag is used to style the text differently than normal text. Browsers traditionally format the text found within the <u> tag with an underline. You can change this behavior with CSS.
Browser Compatibility
The <u> tag has basic support with the following browsers:
- Chrome
- Android
- Firefox (Gecko)
- Firefox Mobile (Gecko)
- Internet Explorer (IE)
- Edge Mobile
- Opera
- Opera Mobile
- Safari (WebKit)
- Safari Mobile
Example
We will discuss the <u> tag below, exploring examples of how to use the <u> tag in HTML5, HTML 4.01 Transitional, XHTML 1.0 Transitional, XHTML 1.0 Strict, and XHTML 1.1.
HTML5 Document
If you created a new web page in HTML5, your <u> tag might look like this:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML5 Example by www.techonthenet.com</title>
</head>
<body>
<h1>Heading 1</h1>
<p>We want to annotate <u>this text</u>.</p>
</body>
</html>
In this HTML5 Document example, we have created the <u> tag to denote non-textual annotated text. Your browser, by default, will display "this text" as underlined text. You can overwrite this behavior with CSS.
HTML 4.01 Transitional Document
If you created a new web page in HTML 4.01 Transitional, your <u> tag might look like this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>HTML 4.01 Transitional Example by www.techonthenet.com</title>
</head>
<body>
<h1>Heading 1</h1>
<p>We want to annotate <u>this text</u>.</p>
</body>
</html>
In this HTML 4.01 Transitional Document example, we have created the <u> tag to denote non-textual annotated text. Your browser, by default, will display "this text" as underlined text. You can overwrite this behavior with CSS.
XHTML 1.0 Transitional Document
If you created a new web page in XHTML 1.0 Transitional, your <u> tag might look like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>XHMTL 1.0 Transitional Example by www.techonthenet.com</title>
</head>
<body>
<h1>Heading 1</h1>
<p>We want to annotate <u>this text</u>.</p>
</body>
</html>
In this XHTML 1.0 Transitional Document example, we have created the <u> tag to denote non-textual annotated text. Your browser, by default, will display "this text" as underlined text. You can overwrite this behavior with CSS.
XHTML 1.0 Strict Document
For XHTML 1.0 Strict documents, you can not use the <u> tag.
XHTML 1.1 Document
For XHTML 1.1 documents, you can not use the <u> tag.