<sup>: Das Superscript-Element

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Das <sup> HTML-Element spezifiziert Inline-Text, der aus rein typografischen Gründen als superscript angezeigt werden soll. Superscripts werden üblicherweise mit einer angehobenen Basislinie und kleinerem Text dargestellt.

Probieren Sie es aus

<p>
  The <em>Pythagorean theorem</em> is often expressed as the following equation:
</p>

<p>
  <var>a<sup>2</sup></var> + <var>b<sup>2</sup></var> = <var>c<sup>2</sup></var>
</p>

p {
  font:
    1rem "Fira Sans",
    sans-serif;
}

Attribute

Dieses Element beinhaltet nur die globalen Attribute.

Verwendungszweck

Das <sup>-Element sollte nur aus typografischen Gründen verwendet werden, also um die Position des Textes gemäss typografischen Konventionen oder Standards zu ändern, nicht ausschliesslich für Präsentations- oder Erscheinungszwecke.

Um beispielsweise das Markenzeichen eines Unternehmens oder Produkts, das eine angehobene Basislinie verwendet, zu stylen, sollte CSS und nicht <sup> benutzt werden (höchstwahrscheinlich vertical-align). Dies würde zum Beispiel mit vertical-align: super oder, um die Basislinie um 50% anzuheben, vertical-align: 50% umgesetzt werden.

Geeignete Anwendungsfälle für <sup> beinhalten (sind jedoch nicht notwendigerweise darauf beschränkt):

  • Darstellung von Exponenten, wie "x3". Es könnte der Einsatz von MathML in Erwägung gezogen werden, insbesondere bei komplexeren Fällen. Siehe Exponenten unter Beispiele unten.
  • Darstellung von höhergestellten Buchstaben, die in einigen Sprachen bei der Wiedergabe bestimmter Abkürzungen verwendet werden. Zum Beispiel kann im Französischen das Wort "mademoiselle" als "Mlle" abgekürzt werden; dies ist ein akzeptabler Anwendungsfall. Siehe Höhergestellte Buchstaben für Beispiele.
  • Darstellung von Ordnungszahlen, wie "4th" anstelle von "fourth". Siehe Ordungszahlen für Beispiele.

Beispiele

Exponenten

Exponenten oder Potenzen einer Zahl sind eines der häufigsten Einsatzgebiete für hochgestellten Text. Zum Beispiel:

html
<p>
  One of the most common equations in all of physics is <var>E</var>=<var>m</var
  ><var>c</var><sup>2</sup>.
</p>

Ergebnis

Höhergestellte Buchstaben

Höhergestellte Buchstaben sind technisch gesehen nicht dasselbe wie Superscript. Es ist jedoch gängig, <sup> zu verwenden, um höhergestellte Buchstaben in HTML darzustellen. Zu den häufigsten Anwendungen höhergestellter Buchstaben gehört die Präsentation bestimmter Abkürzungen im Französischen:

html
<p>Robert a présenté son rapport à M<sup>lle</sup> Bernard.</p>

Ergebnis

Ordnungszahlen

Ordnungszahlen, wie "fourth" im Englischen oder "quinto" im Spanischen, können abgekürzt unter Verwendung von Ziffern und sprachspezifischem, als hochgestellt dargestelltem Text:

html
<p>
  The ordinal number "fifth" can be abbreviated in various languages as follows:
</p>
<ul>
  <li>English: 5<sup>th</sup></li>
  <li>French: 5<sup>ème</sup></li>
</ul>

Ergebnis

Technische Zusammenfassung

Inhaltskategorien Flussinhalt, Phraseninhalt, greifbarer Inhalt.
Erlaubter Inhalt Phraseninhalt.
Tag-Auslassung Keine, sowohl das Start- als auch das End-Tag sind obligatorisch.
Erlaubte Eltern Jedes Element, das Phraseninhalt akzeptiert.
Implizierte ARIA-Rolle superscript
Erlaubte ARIA-Rollen Beliebig
DOM-Schnittstelle [`HTMLElement`](/de/docs/Web/API/HTMLElement)

Spezifikationen

Specification
HTML
# the-sub-and-sup-elements

Browser-Kompatibilität

Siehe auch

  • Das <sub> HTML-Element, das Subscripts erzeugt. Beachten Sie, dass sub und sup nicht gleichzeitig verwendet werden können: Sie müssen MathML verwenden, um sowohl ein Superscript als auch ein Subscript neben dem chemischen Symbol eines Elements anzuzeigen, welches seine Ordnungs- und Massenzahl repräsentiert.
  • Die MathML-Elemente <msub>, <msup> und <msubsup>.
  • Die CSS-Eigenschaft vertical-align.