Mettre en italique en HTML

La balise <i> est traditionnellement utilisée pour afficher du texte en italique.

En HTML 5, elle sert surtout à mettre en avant un mot ou une expression d’un registre différent : termes techniques, mots d’une langue étrangère, titres d’œuvre, etc.

Structure et syntaxe de la balise <i>

Structure et syntaxe de base

La balise <i> est une balise conteneur (on parle aussi de balise de couple). Elle se compose :

• d’une balise d’ouverture <i> ;
• d’une balise de fermeture </i>.

Exemple générique :

<i>[Texte à mettre en italique]</i>

Exemple d’utilisation

Prenons un exemple réel :

<p>Le terme <i>responsive design</i> est aujourd’hui incontournable.</p>

Le mot “responsive design” apparaîtra en italique pour souligner le terme anglais spécialisé. 😬

Attributs

La balise <i> accepte les attributs globaux du HTML : class, id, style, title, etc.

Différence avec d’autres balises similaires

• <em> : ajoute une emphase sémantique (lecture à voix haute, accessibilité) ; visuellement italique par défaut mais sert surtout à accentuer l’importance d’un mot.
• <b> : met du texte en gras pour attirer l’œil sans emphase sémantique.
• <strong> : indique un texte d’une importance particulère (hiérarchie, avertissement), rendu visuellement en gras.

Bonnes pratiques

Réservez <i> aux passages devant représenter une voix ou un style différent : titres d’ouvrage, latin scientifique, termes étrangers, icônes (via polices d’icônes), pensées intérieures, etc.

Pour souligner l’importance d’un mot ou une intonation dans votre phrase, préférez la balise <em>.

Compatibilité des navigateurs

La balise <i> est prise en charge par 100 % des navigateurs modernes et anciens ; elle existe depuis les toutes premières versions du HTML.