dir
Définit la direction du texte dans un élément : gauche-droite (ltr), droite-gauche (rtl), ou automatique (auto).
Description
L’attribut dir spécifie la direction d’écriture du texte contenu dans l’élément. Il est essentiel pour le support des langues à écriture droite-gauche comme l’arabe, l’hébreu ou le persan. Il affecte la disposition visuelle du texte et l’alignement des éléments en ligne.
Syntaxe
<html lang="ar" dir="rtl">…</html>
<p dir="rtl">مرحبًا بالعالم</p>
Valeurs
| Valeur | Description |
|---|---|
ltr | Gauche vers droite (Latin, cyrillique…) |
rtl | Droite vers gauche (arabe, hébreu, persan…) |
auto | Le navigateur détecte la direction selon le contenu Unicode |
Exemples
Page bilingue avec sections de directions différentes :
<article>
<h1>Introduction</h1>
<p>This is the English version.</p>
<p dir="rtl" lang="ar">هذا هو النص العربي.</p>
</article>
Texte généré par l’utilisateur (direction inconnue) :
<p dir="auto">{{ contenu_utilisateur }}</p>
Notes
Héritage : dir s’hérite sur les enfants. Posé sur <html>, il s’applique à toute la page.
auto pour le contenu utilisateur : quand la direction est inconnue (contenus générés par l’utilisateur), dir="auto" permet au navigateur de détecter automatiquement la direction selon le premier caractère fortement directionnel.
CSS direction : l’attribut dir est équivalent à la propriété CSS direction, mais la version HTML est préférable car elle est disponible avant le chargement du CSS.
Support navigateurs
Chrome1+ · Firefox1+ · Safari≤4+ · Edge≤15+