Guide complet de la propriété CSS unicode-bidi : Contrôlez l'affichage des caractères bidi-directionnels

Tutoriel CSS : Propriété unicode-bidi

Définition de la propriété css unicode-bidi

La propriété CSS unicode-bidi permet de contrôler la direction de l'affichage des caractères bidiirectionnels (bi-directionnels) dans le texte. Elle est souvent utilisée en conjonction avec la propriété direction.

Syntaxe générale de la propriété css unicode-bidi

      selector {
        unicode-bidi: normal | embed | bidi-override | isolate | isolate-override | plaintext;
      }
  

Valeurs possibles de la propriété css unicode-bidi

• normal: L'affichage des caractères bi-directionnels suit l'ordre logique du texte environnant.
• embed: L'affichage des caractères bi-directionnels suit l'ordre logique du texte environnant, mais peut être remplacé par un ordre différent si nécessaire.
• bidi-override: L'affichage des caractères bi-directionnels suit explicitement l'ordre défini par la propriété direction.
• isolate: Indique que l'élément doit être formaté indépendamment des autres éléments du texte environnant.
• isolate-override: Indique que l'élément doit être formaté indépendamment des autres éléments du texte environnant, avec un ordre bidi-directionnel défini par la propriété direction.
• plaintext: Force le texte à être affiché sans formatage bidi-directionnel.

Exemples pratiques d'utilisation de la propriété css unicode-bidi

Supposons que vous ayez un paragraphe de texte en langue arabe (qui est une langue bidi-directionnelle) à l'intérieur d'un élément avec un texte en anglais:

 <div   class="container">
	<p>English text...</p>
	<p>عربي</p>
	<p>More English text...</p>
 </div>

Dans cet exemple, nous pouvons appliquer la propriété unicode-bidi à l'élément conteneur pour contrôler la direction de l'affichage du texte en arabe:

    .container {
      unicode-bidi: bidi-override;
      direction: rtl;
    }

Cela forcera le texte en arabe à être affiché de droite à gauche (RTL) et à ignorer la direction du texte environnant en anglais.

Astuces et conseils d'utilisation de la propriété css unicode-bidi

• Assurez-vous de comprendre la structure bidi-directionnelle du texte que vous manipulez avant d'utiliser la propriété unicode-bidi.
• Expérimentez avec différentes valeurs de la propriété unicode-bidi pour obtenir l'affichage souhaité.
• Utilisez la propriété direction en conjonction avec unicode-bidi pour un contrôle plus précis de l'affichage du texte bidi-directionnel.
• Veillez à tester l'affichage de votre texte sur différents navigateurs et plateformes pour assurer une compatibilité optimale.

En comprenant et en utilisant correctement la propriété unicode-bidi, vous pouvez contrôler l'affichage des caractères bi-directionnels dans votre page HTML de manière précise et cohérente.

Prise en charge de la propriété dans les navigateurs

Les numéros figurant dans le tableau indiquent la première version du navigateur qui prend totalement en charge la propriété.

Les numéros suivis de -webkit- indiquent la première version qui fonctionne avec un préfixe.

Explorateur
Verssion	2	5.5	1	1.3	9.2