Unicode-bidi - CSS-Tricks

Anonim

Die unicode-bidiEigenschaft ist eine von zwei CSS-Eigenschaften, die das Rendern von bidirektionalem Text in HTML und ähnlichen markupbasierten Sprachen (z. B. XML) übernehmen. Die andere Eigenschaft ist direction, und die beiden werden zusammen verwendet, um Ebenen von eingebettetem Text mit unterschiedlichen Textrichtungen (von rechts nach links und von links nach rechts) in einem einzelnen DOM-Element zu erstellen.

.bilingual-excerpt ( direction: rtl; unicode-bidi: embed; )

Der Browser bestimmt normalerweise, in welche Richtung Inline-Text fließt, abhängig vom langAttribut der Elemente, dem Gebietsschema des Browsers und font-familybestimmten Elementen. unicode-bidiDies ist praktisch, wenn ein Element sowohl LTR-Text als auch RTL-Text enthält:

Der Benutzeragent wendet einen komplexen Algorithmus an, der durch den Unicode-Standard definiert ist, um zu bestimmen, wie der Text angezeigt werden soll. Diese Eigenschaft steuert speziell die Einbettungsstufen und Überschreibungen für den bidirektionalen Unicode-Algorithmus.

Die unicode-bidiEigenschaft hat drei weit verbreitete Werte:

  1. Das Schlüsselwort "normal", das keine zusätzlichen Ebenen für eingebetteten bidirektionalen Text bietet (das Standardverhalten des Browsers). Ein Element mit dieser Eigenschaft enthält nur LTR- oder RTL-Text.
  2. Das Schlüsselwort "Einbetten", das bidirektionalen Text in einem Element ermöglicht (z. B. RTL-Text, der zwischen LTR-Text fließt). Dies wird durch die directionEigenschaft bestimmt und muss auf ein Inline-Element angewendet werden.
  3. das Schlüsselwort "bidi-override", das sich bei Anwendung auf Inline-Elemente genauso verhält wie "einbetten". Bei Elementen auf Blockebene überschreibt es den bidirektionalen Textalgorithmus des Browsers und fließt den Text in allen untergeordneten Inline-Elementen genau entsprechend der directionEigenschaft.

Sehenswürdigkeiten

  • Die unicode-bidiEigenschaft ist “ist für DTD-Designer bestimmt. Webdesigner und ähnliche Autoren sollten dies nicht überschreiben. “ Entscheiden Sie sorgfältig, ob Sie es verwenden müssen.
  • Während Internet Explorer unicode-bidiseit Version 5.5 technisch unterstützt , gibt es „schwerwiegende Fehler in Bezug auf schwebende Elemente“ und die Verwendung ist in IE 8+ zuverlässig (siehe unten).

Browser-Unterstützung

Chrom Safari Feuerfuchs Oper IE Android iOS
Funktioniert Funktioniert Funktioniert Funktioniert 8.0+ Funktioniert Funktioniert

Verwandte Eigenschaften

Almanach am 5. Januar 2021

Richtung

.element ( direction: rtl; ) Jwahir Sundai Almanach am 5. Januar 2021

Schreibmodus

.element ( writing-mode: vertical-rl; ) Robin Rendle