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

mozilla

Revision 492877 of <sup>

  • Revision slug: Web/HTML/Element/sup
  • Revision title: <sup>
  • Revision id: 492877
  • Created:
  • Creator: kscarfone
  • Is current revision? No
  • Comment Added {{HTMLRef}}

Revision Content

Summary

The HTML Superscript Element (<sup>) defines a span of text that should be displayed, for typographic reasons, higher, and often smaller, than the main span of text.

Usage note:

  • This element should be used for typographical reasons only, i.e. changing the position of the text changing its meaning like in mathematical (like f4, though the use of a MathML formula should be considered) or in French abbreviations (like Mlle, Mme or Cie).
  • This element must not be used for styling purpose like the styling of the product name Latex. In that case CSS style should be used: the {{ cssxref("vertical-align") }} property with the sup value will achieve the same effect.

Usage context

Content categories Flow content and phrasing content
Permitted content Phrasing content
Tag omission None as both the start and end tag are mandatory
Permitted parent elements Any element that can contain phrasing content
Normative document HTML5, section 4.6.14 (HTML4.01, section 9.2.3)

Attributes

This element only includes the global attributes.

DOM interface

This element implements the HTMLElement interface.

Implementation note: up to Gecko 1.9.2 inclusive, Firefox implements the HTMLSpanElement interface for this element.

Examples

<p>This text is <sup>superscripted</sup></p>

Result

This text is superscripted

See also

  • The {{ HTMLElement("sub") }} HTML element that produces subscripts. Note that you cannot use them both at the same time and you need to use MathML to produce both a superscript and a subscript next to the chemical symbol of an element, representing its atomic number and its nuclear number.
  • The <msub>, <msup>, and <msubsup> MathML elements.

{{HTMLRef}}

Revision Source

<h2 id="Summary">Summary</h2>
<p>The <em>HTML Superscript Element</em> (<code>&lt;sup&gt;</code>) defines a span of text that should be displayed, for typographic reasons, higher, and often smaller, than the main span of text.</p>
<div class="note">
 <p><strong>Usage note:</strong></p>
 <ul>
  <li>This element should be used for typographical reasons only, i.e. changing the position of the text changing its meaning like in mathematical (like <var>f<sup>4</sup></var>, though the use of a <a href="/en/MathML" title="en/MathML">MathML</a> formula should be considered) or in French abbreviations (like M<sup>lle</sup>, M<sup>me</sup> or C<sup>ie</sup>).</li>
  <li>This element must not be used for styling purpose like the styling of the product name Latex. In that case <a href="/en/CSS" title="en/CSS">CSS</a> style should be used: the {{ cssxref("vertical-align") }} property with the <span style="font-family: Courier New;">sup</span> value will achieve the same effect.</li>
 </ul>
</div>
<h2 id="Usage_context">Usage context</h2>
<table class="standard-table">
 <tbody>
  <tr>
   <td><a href="/en/HTML/Content_categories" title="en/HTML/Content categories">Content categories</a></td>
   <td>Flow content and phrasing content</td>
  </tr>
  <tr>
   <td>Permitted content</td>
   <td>Phrasing content</td>
  </tr>
  <tr>
   <td>Tag omission</td>
   <td>None as both the <span title="syntax-start-tag">start and end tag</span> are mandatory</td>
  </tr>
  <tr>
   <td>Permitted parent elements</td>
   <td>Any element that can contain phrasing content</td>
  </tr>
  <tr>
   <td>Normative document</td>
   <td><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-sub-and-sup-elements" rel="external nofollow" target="_blank" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-sub-and-sup-elements">HTML5, section 4.6.14</a> (<a class="external" href="http://www.w3.org/TR/REC-html40/struct/text.html#h-9.2.3" title="http://www.w3.org/TR/REC-html40/struct/text.html#h-9.2.3">HTML4.01, section 9.2.3</a>)</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="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">
 <p><strong>Implementation note: </strong>up to Gecko 1.9.2 inclusive, Firefox implements the <a href="/en/DOM/span" title="en/DOM/span"><span style="font-family: Courier New;">HTMLSpanElement</span></a> interface for this element.</p>
</div>
<h2 id="Examples">Examples</h2>
<pre class="brush: html">
&lt;p&gt;This text is &lt;sup&gt;superscripted&lt;/sup&gt;&lt;/p&gt;
</pre>
<h4 id="Result">Result</h4>
<p>This text is <sup>superscripted</sup></p>
<h2 id="See_also">See also</h2>
<ul>
 <li>The {{ HTMLElement("sub") }} HTML element that produces subscripts. Note that you cannot use them both at the same time and you need to use <a href="/en/MathML" title="en/MathML">MathML</a> to produce both a superscript and a subscript next to the chemical symbol of an element, representing its atomic number and its nuclear number.</li>
 <li>The <a href="/en/MathML/Element/msub" title="en/MathML/Element/msub"><span style="font-family: Courier New;">&lt;msub&gt;</span></a>, <a href="/en/MathML/Element/msup" title="en/MathML/Element/msup"><span style="font-family: Courier New;">&lt;msup&gt;</span></a>, and <a href="/en/MathML/Element/msubsup" title="en/MathML/Element/msubsup"><span style="font-family: Courier New;">&lt;msubsup&gt;</span></a> MathML&nbsp;elements.</li>
</ul>
<p>{{HTMLRef}}</p>
Revert to this revision