<sup> : l'élément de mise en exposant

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.

L'élément HTML <sup> est utilisé, pour des raisons typographiques, afin d'afficher du texte en exposant (plus haut et généralement plus petit) par rapport au bloc de texte environnant.

Exemple interactif

Attributs

Cet élément inclut uniquement les attributs universels.

Notes d'utilisation

Cet élément devrait uniquement être utilisé pour des raisons typographiques lorsque la position du texte est liée à la signification de ce texte (par exemple pour une formule mathématiques) ou aux règles typographiques (par exemple en français pour Mlle, Mme ou Cie).

Ainsi, on n'utilisera pas <sup> afin d'obtenir un effet visuel d'un logo par exemple. Pour un simple effet de mise en forme (hors typographie), on utilisera plutôt la propriété vertical-align, utilisée avec la valeur super (voire avec une valeur numérique si on souhaite être plus précis).

Voici quelques cas d'utilisation (non exhaustifs) pour <sup> :

  • L'utilisation d'exposants dans une formule mathématique : x

    2

    .

    • Dans le cadre de formules complexes, MathML peut s'avérer plus pertinent que l'enchaînement d'éléments <sub> et <sup>.

  • L'affichage de lettres supérieures pour respecter certaines conventions typographiques (ex. M

    lle

    ).

  • La représentation de nombres ordinaux : 7

    e

    art.

Exemples

Puissance mathématique

HTML

html
<p>Voici la fonction exponentielle : e<sup>x</sup>.</p>

Résultat

Lettres supérieures

Bien que, techniquement, le lettrage supérieur ne corresponde pas à la mise en exposant, on voit souvent <sup> utilisé pour certaines abréviations.

HTML

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

Résultat

Nombres ordinaux

HTML

html
<p>
  Voici comment le nombre ordinal cinquième est écrit dans différentes langues
</p>
<ul>
  <li>en français : 5<sup>e</sup></li>
  <li>en anglais : 5<sup>th</sup></li>
</ul>

Résultat

Résumé technique

Catégories de contenu Contenu de flux, contenu phrasé.
Contenu autorisé Contenu phrasé.
Omission de balises Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires
Parents autorisés Tout élément acceptant du contenu phrasé.
Rôles ARIA autorisés Tous les rôles sont autorisés.
Interface DOM HTMLElement

Spécifications

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

Compatibilité des navigateurs

BCD tables only load in the browser

Voir aussi

  • L'élément HTML <sub> permet un effet de mise en indice. Il est à noter que l'élément <sub> et l'élément <sup> ne peuvent pas être utilisés simultanément. Pour afficher le symbole chimique d'un élément, il faudra utiliser MathML pour représenter à la fois le numéro atomique et le nombre de masse.
  • Les éléments MathML <msub>, <msup> et <msubsup>.
  • La propriété CSS vertical-align.