<hr> : l'élément de rupture thématique (règle horizontale)

Exemple interactif

<p>
  §1&nbsp;: La première règle du Fight Club est&nbsp;: vous ne parlez pas du
  Fight Club.
</p>

<hr />

<p>
  §2&nbsp;: La deuxième règle du Fight Club est&nbsp;: apportez toujours des
  cupcakes.
</p>

hr {
  border: none;
  border-top: 3px double #333333;
  color: #333333;
  overflow: visible;
  text-align: center;
  height: 5px;
}

hr::after {
  background: white;
  content: "§";
  padding: 0 4px;
  position: relative;
  top: -13px;
}

Historiquement, il était présenté comme une règle ou une ligne horizontale. Bien qu'il puisse encore être affiché comme une règle horizontale par les navigateurs visuels, cet élément est désormais défini en termes sémantiques plutôt qu'en termes de présentation ; si vous souhaitez tracer une ligne horizontale, faites‑le à l'aide du CSS approprié.

Attributs

Cet élément prend en charge les attributs universels.

Attributs dépréciés, obsolètes ou non-standard

align Obsolète Non standard

Définit l'alignement de la ligne horizontale sur la page. Si aucune valeur n'est renseignée, la valeur prise par défaut est left.

color Obsolète Non standard

Définit la couleur à utiliser pour la ligne horizontale, grâce à un nom de couleur SVG ou à un code hexadécimal (précédé d'un #).

noshade Obsolète Non standard

Avec cet attribut, la ligne horizontale n'aura pas d'ombre.

size Obsolète Non standard

Définit la hauteur de la ligne, exprimée en pixels.

width Obsolète Non standard

Définit la longueur de la ligne, exprimée par une valeur en pixels ou en pourcents.

Exemples

HTML

<p>
  Ceci est le premier paragraphe du texte. Les pandas roux sont géniaux. C'est
  mignon et c'est tout doux.
</p>

<hr />

<p>
  Ceci est le deuxième paragraphe du texte. Les poneys ne sont pas pareils. Ils
  sont plus grands et moins exotiques.
</p>

Résultat

Résumé technique

Spécifications

Compatibilité des navigateurs

Voir aussi

• L'élément <p>
• <hr> dans <select>