Expand your HTML skills through an MDN Fellowship - Apply by April 1 http://mzl.la/MDNFellowship

mozilla

Revision 326377 of <u>

  • Revision slug: HTML/Element/u
  • Revision title: u
  • Revision id: 326377
  • Created:
  • Creator: Deraillor
  • Is current revision? No
  • Comment There are several rendering fixes that need to be made, including the <cite> element, and the "text-decoration: underline;" CSS in-line styling, to show up properly in the latest version of Chrome (Version 23.0.1271.64 as of this writing).

Revision Content

Summary

The HTML Underline Element (<u>) renders text with an underline, a line under the baseline of its content.

In HTML5, this element represents a span of text with an unarticulated, though explicitly rendered, non-textual annotation, such as labeling the text as being a proper name in Chinese text (a Chinese proper name mark), or labeling the text as being misspelled.

Usage Note: As all purely styling element, {{ HTMLElement("u") }} has been deprecated in HTML 4 and XHTML 1, but it has been re-introduced in HTML5 with other semantics. If you want to underline text in a non-semantic manner, you should use a {{ HTMLElement("span") }} element, or another semantically appropriate element, and style it with the CSS {{ cssxref("text-decoration") }} property, with the underline value.

Attributes

This element has no other attributes than the global attributes, common to all elements.

DOM interface

This element implements the HTMLElement interface.

Implementation note: up to Gecko 1.9.2 inclusive, Firefox implements the {{ domxref("HTMLSpanElement") }} interface for this element.

Example

<u>Today's Special</u>: Salmon<br />
<span style="text-decoration:underline;">Today's Special</span>: Salmon

Today's Special: Salmon

Today's Special: Salmon

<p><u>All</u> of that is explained in <u>Dive into Python</u>.

All of that is explained in Dive into Python.

should instead be

<p><em>All</em> of that is explained in <cite>Dive into Python</cite>.

All of that is explained in Dive into Python.

CSS can be used to style those elements exactly the same, however.

See Also

  • The {{ HTMLElement("span") }}, {{ HTMLElement("i") }}, {{ HTMLElement("em") }}, {{ HTMLElement("cite") }} elements are, depending on the case, to be used instead.
  • The CSS {{ cssxref("text-decoration") }} property to be used to achieve the former visual aspect of the {{ HTMLElement("u") }} element.
{{ HTML:Element_Navigation() }}
{{ languages({"ja":"ja/HTML/Element/u","en":"en/HTML/Element/u"}) }}

Revision Source

<h2 id="Summary">Summary</h2>
<p>The <em>HTML Underline Element</em> (<code>&lt;u&gt;</code>) renders text with an underline, a line under the baseline of its content.</p>
<p>In HTML5, this element represents a span of text with an unarticulated, though explicitly rendered, non-textual annotation, such as labeling the text as being a proper name in Chinese text (a Chinese proper name mark), or labeling the text as being misspelled.</p>
<div class="note">
  <strong>Usage Note: </strong>As all purely styling element, {{ HTMLElement("u") }} has been deprecated in HTML 4 and XHTML 1, but it has been re-introduced in HTML5 with other semantics. If you want to underline text in a non-semantic manner, you should use a {{ HTMLElement("span") }} element, or another semantically appropriate element, and style it with the <a href="/en/CSS" title="en/CSS">CSS</a> {{ cssxref("text-decoration") }} property, with the <span style="font-family: Courier New;">underline</span> value.</div>
<h2 id="Attributes">Attributes</h2>
<p>This element has no other attributes than the <a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">global attributes</a>, common to all elements.</p>
<h2 id="DOM_interface">DOM interface</h2>
<p>This element implements the <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code> interface.</p>
<div class="note">
  <strong>Implementation note: </strong>up to Gecko 1.9.2 inclusive, Firefox implements the {{ domxref("HTMLSpanElement") }} interface for this element.</div>
<h2 id="Example">Example</h2>
<pre class="eval">
&lt;u&gt;Today's Special&lt;/u&gt;: Salmon&lt;br /&gt;
&lt;span style="text-decoration:underline;"&gt;Today's Special&lt;/span&gt;: Salmon
</pre>
<p><u>Today's Special</u>: Salmon</p>
<p><span style="text-decoration: underline;">Today's Special</span>: Salmon</p>
<pre>
&lt;p&gt;&lt;u&gt;All&lt;/u&gt; of that is explained in &lt;u&gt;Dive into Python&lt;/u&gt;.
</pre>
<p><u>All</u> of that is explained in <u>Dive into Python</u>.</p>
<p>should instead be</p>
<pre>
&lt;p&gt;&lt;em&gt;All&lt;/em&gt; of that is explained in &lt;cite&gt;Dive into Python&lt;/cite&gt;.
</pre>
<p><em>All</em> of that is explained in <cite>Dive into Python</cite>.</p>
<p>CSS can be used to style those elements exactly the same, however.</p>
<h2 id="See_Also">See Also</h2>
<ul>
  <li>The {{ HTMLElement("span") }}, {{ HTMLElement("i") }}, {{ HTMLElement("em") }}, {{ HTMLElement("cite") }} elements are, depending on the case, to be used instead.</li>
  <li>The CSS&nbsp;{{ cssxref("text-decoration") }} property to be used to achieve the former visual aspect of the {{ HTMLElement("u") }} element.</li>
</ul>
<div>
  {{ HTML:Element_Navigation() }}</div>
<div>
  {{ languages({"ja":"ja/HTML/Element/u","en":"en/HTML/Element/u"}) }}</div>
Revert to this revision