La balise <bdo> (Bi-Directional Override) est une balise HTML qui permet de forcer la direction d'écriture du texte qu'elle contient, quelle que soit la direction prédéfinie du document ou de l'élément parent.
Elle est souvent utilisée pour gérer des situations particulières dans des contenus multilingues.
Structure et syntaxe de la balise <bdo>
Structure et syntaxe de base
La balise <bdo> est une balise conteneur qui à :
- Une balise d'ouverture :
<bdo>; - Une balise de fermeture :
</bdo>.
Elle est souvent combinée avec l'attribut dir pour définir la direction d'écriture, qui peut être :
ltr: Gauche à droite (Left to Right 🇺🇸).rtl: Droite à gauche (Right to Left 🇺🇸).
Exemple d'utilisation
Voici un exemple pratique :
<p>Texte affiché normalement : Bonjour</p>
<p>Texte forcé en droite-à-gauche : <bdo dir="rtl">Bonjour</bdo></p>Dans cet exemple, le mot "Bonjour" s'affichera de droite à gauche dans le second paragraphe, indépendamment de la directionnalité globale de la page.
Attributs
La balise <bdo> accepte les attributs classiques du HTML, tels que title, class ou même id.
Elle utilise aussi l'attribut dir, obligatoire pour spécifier la direction d'écriture.
Cet attribut peut prendre les valeurs suivantes :
ltr(par défaut) : Direction de gauche à droite.rtl: Direction de droite à gauche.
Différence avec d'autres balises similaires
<span>: Permet de styliser le texte sans forcer sa directionnalité.<bdi>: Isole une portion de texte pour gérer la directionnalité de façon automatique, sans la forcer.
Compatibilité des navigateurs
La balise <bdo> est prise en charge par tous les navigateurs modernes.
| Navigateur | Compatibilité |
|---|---|
| Chrome | Oui |
| Firefox | Oui |
| Safari | Oui |
| Edge | Oui |
| Internet Explorer | Oui |