<sup>

  • Revision slug: HTML/Element/sup
  • Revision title: sup
  • Revision id: 81360
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment 1 words added, 1 words removed

Revision Content

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({{ HTMLVersionInline("4") }} : HTML4.01, section 9.2.3)

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 HTMLSpanElement interface for this element.

See also

  • The {{ HTMLElement("sub") }} HTML element that produce superscript. 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.

Revision Source

<p>The <em>HTML Superscript Element</em> (<span style="font-family: Courier New;">&lt;sup&gt;</span>) 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">
<ul> <p><strong>Usage note:</strong></p> <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>Usage context</h2>
<table class="fullwidth-table" style="width: 1125px; height: 117px;"> <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> <td> </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>({{ HTMLVersionInline("4") }} : <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>Attributes</h2>
<p>This element has no other attributes than the <a class="new " href="../../../../en/HTML/global_attributes" rel="internal" title="en/HTML/global attributes">global attributes</a>, common to all elements.</p>
<h2>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>See also</h2>
<ul> <li>The {{ HTMLElement("sub") }} HTML element that produce superscript. 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 elements.</li>
</ul>
Revert to this revision