<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 juillet 2015.
L'élément HTML <sup> permet d'afficher du texte en exposant, uniquement pour des raisons typographiques. Le texte est alors positionné plus haut que la ligne de base et généralement en plus petit.
Exemple interactif
<p>
Le <em>théorème de Pythagore</em> est souvent exprimé sous la forme d'équation
suivante :
</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;
}
Attributs
Cet élément inclut uniquement les attributs universels.
Notes d'utilisation
L'élément <sup> doit être utilisé uniquement pour des raisons typographiques : il sert à modifier la position du texte afin de respecter les conventions ou normes typographiques, et non simplement pour des raisons de présentation ou d'apparence.
Par exemple, la mise en forme d'une marque verbale (angl.) d'entreprise ou de produit qui utilise une ligne de base surélevée doit être réalisée avec du CSS (généralement vertical-align) plutôt qu'avec <sup>. On utilisera par exemple vertical-align: super ou, pour décaler la ligne de base de 50 %, vertical-align: 50%.
Les cas d'utilisation appropriés de <sup> incluent (sans s'y limiter) :
- Affichage d'exposants, comme « x3 ». Il peut être pertinent d'utiliser MathML pour ces cas, surtout s'ils sont complexes. Voir Exposants dans la section Exemples ci-dessous.
- Affichage de lettres supérieures (angl.), utilisées dans certaines langues pour certaines abréviations. Par exemple, en français, « mademoiselle » peut s'abréger en « Mlle » : c'est un usage approprié. Voir Lettres supérieures pour des exemples.
- Représentation de nombres ordinaux, comme « 4e » au lieu de « quatrième ». Voir Nombres ordinaux pour des exemples.
Exemples
Exposants
Les exposants, ou puissances d'un nombre, sont parmi les utilisations les plus courantes du texte en exposant. Par exemple :
HTML
<p>
Une des équations les plus courantes en physique est <var>E</var>=<var>m</var
><var>c</var><sup>2</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
<p>Robert a présenté son rapport à M<sup>lle</sup> Bernard.</p>
Résultat
Nombres ordinaux
Les nombres ordinaux, comme « quatrième » en français, « fourth » en anglais ou « quinto » en espagnol, peuvent être abrégés à l'aide de chiffres et de texte spécifique à la langue affiché en exposant :
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 tangible. |
|---|---|
| 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ôle ARIA implicite |
superscript
|
| Rôles ARIA autorisés | Tous les rôles sont autorisés. |
| Interface DOM | HTMLElement |
Spécifications
| Specification |
|---|
| HTML # the-sub-and-sup-elements |
Compatibilité des navigateurs
Loading…
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>, " class="only-in-en-us"><msup>et " class="only-in-en-us"><msubsup>. - La propriété CSS
vertical-align.