<i>
Un texte sur un autre ton ou dans une autre voix : expressions étrangères, noms latins, pensées d’un personnage, termes techniques.
- Affichage
- inline
- Balise fermante
- Obligatoire
- Contenu autorisé
- Contenu phrasant
Exemple
#<p>Chez nous, chaque changement de code passe par une <i lang="en">code review</i>.</p>
<p>Elle regarda le message d’erreur rouge dans la console. <i>Pourtant ça marchait hier</i>, pensa-t-elle.</p>Définition et utilisation
#L’élément <i> marque un fragment qui se distingue du reste du texte par le ton ou le caractère : une expression étrangère, un nom latin d’espèce, un terme technique, le nom d’un navire ou les pensées d’un personnage. Les navigateurs l’affichent en italique.
Contrairement à <em>, il n’ajoute pas d’accent et ne change pas le sens de la phrase. Marquez les titres d’œuvres avec <cite>, et un terme défini dans une phrase avec <dfn>.
Ajoutez l’attribut global lang aux expressions en langue étrangère, par exemple <i lang="en">code review</i>. Un lecteur d’écran les lira alors avec la bonne prononciation.
De nombreuses bibliothèques d’icônes utilisent <i> pour insérer des icônes. Cela fonctionne, mais c’est un abus de sa signification. Un <span> avec l’attribut aria-hidden="true" convient mieux.
Syntaxe
#<i>texte sur un autre ton</i>Attributs
#Cet élément n’a pas d’attributs propres. Il accepte les attributs globaux, comme class, id ou hidden.
CSS par défaut
#La plupart des navigateurs affichent cet élément avec ces styles par défaut :
i {
font-style: italic;
}Compatibilité des navigateurs
#Largement disponible
Fonctionne dans tous les navigateurs modernes, y compris sur mobile. Vous pouvez l’utiliser sans crainte.
- Chrome
- Edge
- Firefox
- Safari
Bonnes pratiques
#- Ajoutez
langaux expressions en langue étrangère, pour qu’un lecteur d’écran les prononce correctement. - N’insérez pas d’icônes avec
<i>. Utilisez<span aria-hidden="true">ou une image SVG avec une description. - Si un fragment doit être prononcé avec insistance parce qu’il change le sens de la phrase, choisissez
<em>.
Entrées associées
#- <em> vs <i><em> accentue un mot et change le sens à la lecture à voix haute. <i> indique un autre ton (étranger, nom, pensée) sans rien changer au sens. Les deux sont en italique.
- <em>Un accent dans la phrase : un mot qui, à la lecture à voix haute, se prononce avec insistance.
- <b>Attire l’attention sur un fragment de texte sans lui donner davantage d’importance, par exemple des mots-clés.
- <cite>Le titre d’une œuvre : un livre, un article, un film, une chanson, un jeu ou un logiciel.
- <dfn>Un terme défini à cet endroit du texte, c’est-à-dire la première utilisation, explicative, du concept.
- <span>Un conteneur en ligne générique sans signification, pour styliser un fragment de texte.
Vous voyez une erreur ou il manque un exemple ? Écrivez-nous.