Revision 1130121 of <u>

<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 with all purely styling elements, {{ 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="Usage_context">Usage context</h2>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row"><a href="/en-US/docs/Web/HTML/Content_categories">Content categories</a></th>
   <td><a href="/en-US/docs/Web/HTML/Content_categories#Flow_content">Flow content</a>, <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>, palpable content.</td>
  </tr>
  <tr>
   <th scope="row">Permitted content</th>
   <td><a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">Phrasing content</a>.</td>
  </tr>
  <tr>
   <th scope="row">Tag omission</th>
   <td>{{no_tag_omission}}</td>
  </tr>
  <tr>
   <th scope="row">Permitted parent elements</th>
   <td>Any element that accepts <a href="/en-US/docs/Web/HTML/Content_categories#Phrasing_content">phrasing content</a>.</td>
  </tr>
  <tr>
   <th scope="row">DOM interface</th>
   <td>{{domxref("HTMLElement")}} Up to Gecko 1.9.2 (Firefox 4) inclusive, Firefox implements the {{domxref("HTMLSpanElement")}} interface for this element.</td>
  </tr>
 </tbody>
</table>

<h2 id="Attributes">Attributes</h2>

<p><span style="line-height:21px">This element only includes the&nbsp;</span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">global attributes</a><span style="line-height:21px">.</span></p>

<h2 id="Tips_and_Notes">Tips and Notes</h2>

<p style="line-height: 21px;"><strong>Tip:</strong>&nbsp;Avoid using the {{ HTMLElement("u") }} element where it could be confused for a hyperlink.</p>

<div class="note">
<p><span style="line-height:21px"><strong>Note:</strong>&nbsp;The HTML 5 specification reminds developers that other elements are almost always more appropriate than {{ HTMLElement("u") }}.</span></p>
</div>

<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>

<div class="note">
<p>The following are examples of how elements other than <span style="line-height:21px">{{ HTMLElement("u") }} should be used instead.</span></p>
</div>

<pre class="brush: html">
&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
&lt;!-- Here &lt;span&gt; is used as the underlining is purely decorative and it is applied with CSS --&gt;
</pre>

<p><u>Today's Special</u>: Salmon</p>

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

<pre class="brush: html">
&lt;p&gt;&lt;u&gt;All&lt;/u&gt; of that is explained in &lt;u&gt;Dive into Python&lt;/u&gt;&lt;/p&gt;
&lt;p&gt;&lt;em&gt;All&lt;/em&gt; of that is explained in &lt;i&gt;Dive into Python&lt;/i&gt;&lt;/p&gt;
&lt;!-- Here the "All" is marked as stressed, using &lt;em&gt;, while "Dive into Python" is marked as a name using &lt;i&gt; --&gt; </pre>

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

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

<p>Due to the default styling of {{ HTMLElement("em") }} and {{ HTMLElement("i") }} they have been displayed in italics, however CSS can be used to style those elements with a normal font style and underline.</p>

<h2 id="See_Also">See Also</h2>

<ul>
 <li>The {{ HTMLElement("span") }}, {{ HTMLElement("i") }}, {{ HTMLElement("em") }}, and {{ HTMLElement("cite") }} elements are, depending on the case, to be used instead.</li>
 <li>The CSS&nbsp;{{ cssxref("text-decoration") }} property is to be used to achieve the former visual aspect of the {{ HTMLElement("u") }} element.</li>
</ul>

<p>{{ languages({"ja":"ja/HTML/Element/u","en":"en/HTML/Element/u"}) }}</p>

<div>{{ HTMLRef }}</div>