<mark>

Description

L’élément <mark> indique un texte marqué ou surligné pour une référence ou une notation, en raison de sa pertinence dans le contexte. Usage typique : surlignage des termes de recherche dans les résultats, mise en évidence d’un passage dans une citation, annotation de code.

Syntaxe

<p>Recherche : <mark>CSS Grid</mark> — 42 résultats trouvés.</p>

Exemples

Résultats de recherche :

<ul>
  <li>Apprendre <mark>CSS Grid</mark> en 10 minutes</li>
  <li>Guide complet de <mark>CSS Grid</mark> et Flexbox</li>
</ul>

Passage cité pertinent :

<blockquote>
  <p>Le web est <mark>ouvert par nature</mark> et accessible à tous.</p>
</blockquote>
<p>Ce passage illustre bien le principe d'accessibilité.</p>

Notes

Contexte vs importance : <mark> signale la pertinence contextuelle (ce qui est pertinent maintenant, dans ce contexte) ; <strong> indique l’importance intrinsèque (ce qui est toujours important).

Accessibilité : le surlignage n’est pas toujours annoncé par les lecteurs d’écran. Pour les cas critiques, ajouter du CSS généré via ::before/::after ou un texte visually-hidden : .mark::before { content: "[début surligné] "; }.