<u>: Элемент слабой аннотации (подчеркивание)

The HTML Unarticulated Annotation Element (<u>) represents a span of inline text which should be rendered in a way that indicates that it has a non-textual annotation. This is rendered by default as a simple solid underline, but may be altered using CSS.

This element used to be called the "Underline" element in older versions of HTML, and is still sometimes misused in this way. To underline text, you should instead apply a style that includes the CSS text-decoration property set to underline.

See the Usage notes section for further details on when it's appropriate to use <u> and when it isn't.

Content categories Flow content, phrasing content, palpable content.
Permitted content Phrasing content.
Tag omission Нет, открывающий и закрывающий теги обязательны.
Permitted parents Any element that accepts phrasing content.
Permitted ARIA roles Any
DOM interface HTMLElement

Аттрибуты

This element only includes the global attributes.

Использование

Along with other pure styling elements, the original HTML Underline (<u>) element was deprecated in HTML 4; however, <u> was restored in HTML 5 with a new, semantic, meaning: to mark text as having some form of non-textual annotation applied.

Be careful to avoid using the <u> element with its default styling (of underlined text) in such a way as to be confused with a hyperlink, which is also underlined by default.

Use cases

Valid use cases for the <u> element include annotating spelling errors, applying a proper name mark to denote proper names in Chinese text, and other forms of annotation.

You should not use <u> to simply underline text for presentation purposes, or to denote titles of books.

Other elements to consider using

In most cases, you should use an element other than <u>, such as:

  • <em> to denote stress emphasis
  • <b> to draw attention to text
  • <mark> to mark key words or phrases
  • <strong> to indicate that text has strong importance
  • <cite> to mark the titles of books or other publications
  • <i> to denote technical terms, transliterations, thoughts, or names of vessels in Western texts

To provide textual annotations (as opposed to the non-textual annotations created with <u>), use the <ruby> element.

To apply an underlined appearance without any semantic meaning, use the text-decoration property's value underline.

Примеры

Indicating a spelling error

This example uses the <u> element and some CSS to display a paragraph which includes a misspelled error, with the error indicated in the red wavy underline style which is fairly commonly used for this purpose.

HTML

<p>This paragraph includes a <u class="spelling">wrnogly</u>
spelled word.</p>

In the HTML, we see the use of <u> with a class, spelling, which is used to indicate the misspelling of the word "wrongly".

CSS

u.spelling {
  text-decoration: red wavy underline;
}

This CSS indicates that when the <u> element is styled with the class spelling, it should have a red wavy underline underneath its text. This is a common styling for spelling errors. Another common style can be presented using red dashed underline.

Result

The result should be familiar to anyone who has used any of the more popular word processors available today.

Avoiding <u>

Most of the time, you actually don't want to use <u>. Here are some examples that show what you should do instead in several cases.

Non-semantic underlines

To underline text without implying any semantic meaning, use a <span> element with the text-decoration property set to "underline", as shown below.

HTML
<span class="underline">Today's Special</span>
<br>
Chicken Noodle Soup With Carrots
CSS
.underline {
  text-decoration: underline;
}
Result

Presenting a book title

Book titles should be presented using the <cite> element instead of <u> or even <i>.

HTML
<p>The class read <cite>Moby Dick</cite> in the first term.</p>
Result with default style

Note that the default styling for the <cite> element renders the text in italics. You can, if you wish, override that using CSS:

cite {
  font-style: normal;
  text-decoration: underline;
}
Result with custom style

Спецификации

Specification Status Comment
HTML Living Standard
Определение '<u>' в этой спецификации.
Живой стандарт
HTML5
Определение '<u>' в этой спецификации.
Рекомендация
HTML 4.01 Specification
Определение '<b>' в этой спецификации.
Рекомендация

Поддержка браузерами

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
uChrome Полная поддержка ДаEdge Полная поддержка ДаFirefox Полная поддержка 1
Замечания
Полная поддержка 1
Замечания
Замечания Before Firefox 4, this element implemented the HTMLSpanElement interface instead of the standard HTMLElement interface.
IE Полная поддержка ДаOpera Полная поддержка ДаSafari Полная поддержка ДаWebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка 4Opera Android Полная поддержка ДаSafari iOS Полная поддержка ДаSamsung Internet Android Полная поддержка Да

Легенда

Полная поддержка  
Полная поддержка
Смотрите замечания реализации.
Смотрите замечания реализации.

См. также