unicode-bidi CSS property
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Die CSS-Eigenschaft unicode-bidi bestimmt zusammen mit der Eigenschaft direction, wie bidirektionaler Text in einem Dokument behandelt wird. Wenn ein Inhaltsblock beispielsweise sowohl von links nach rechts als auch von rechts nach links geschriebenen Text enthält, verwendet der User-Agent einen komplexen Unicode-Algorithmus, um zu bestimmen, wie der Text dargestellt wird. Die Eigenschaft unicode-bidi setzt diesen Algorithmus außer Kraft und ermöglicht es Entwicklern, die Einbettung des Textes zu steuern.
Probieren Sie es aus
unicode-bidi: normal;
unicode-bidi: bidi-override;
unicode-bidi: plaintext;
unicode-bidi: isolate-override;
<section class="default-example" id="default-example">
<p class="transition-all" id="example-element">
בְּרֵאשִׁ֖ית בָּרָ֣א אֱלֹהִ֑ים אֵ֥ת הַשָּׁמַ֖יִם וְאֵ֥ת הָאָֽרֶץ.
</p>
</section>
Die Eigenschaften unicode-bidi und direction sind die einzigen Eigenschaften, die nicht vom Shorthand all beeinflusst werden.
Warnung: Diese Eigenschaft ist für Personen gedacht, die Document Type Definitions (DTDs) entwerfen. Webdesigner und andere Autoren sollten sie nicht überschreiben.
Syntax
/* Keyword values */
unicode-bidi: normal;
unicode-bidi: embed;
unicode-bidi: isolate;
unicode-bidi: bidi-override;
unicode-bidi: isolate-override;
unicode-bidi: plaintext;
/* Global values */
unicode-bidi: inherit;
unicode-bidi: initial;
unicode-bidi: revert;
unicode-bidi: revert-layer;
unicode-bidi: unset;
Werte
normal-
Das Element erzeugt im bidirektionalen Algorithmus keine zusätzliche Einbettungsebene. Bei Inline-Elementen funktioniert die implizite Neuanordnung über Elementgrenzen hinweg.
embed-
Wenn das Element ein Inline-Element ist, eröffnet dieser Wert eine zusätzliche Einbettungsebene im bidirektionalen Algorithmus. Die Schreibrichtung dieser Einbettungsebene wird durch die Eigenschaft
directionfestgelegt. bidi-override-
Bei Inline-Elementen setzt dieser Wert die bidirektionale Anordnung außer Kraft. Bei Block-Container-Elementen gilt dies für Nachfahren auf Inline-Ebene, die sich nicht innerhalb eines anderen Block-Container-Elements befinden. Das bedeutet, dass der Inhalt des Elements strikt in der durch die Eigenschaft
directionvorgegebenen Reihenfolge angeordnet wird; der implizite Teil des bidirektionalen Algorithmus wird ignoriert. isolate-
Dieses Schlüsselwort bewirkt, dass die Schreibrichtung des umgebenden Containers ohne Berücksichtigung des Inhalts dieses Elements berechnet wird. Das Element wird dadurch von seinen Geschwisterelementen isoliert. Bei der Anwendung des Algorithmus zur Bestimmung der bidirektionalen Anordnung behandelt das umgebende Element es wie ein oder mehrere
U+FFFC Object Replacement Character, also wie ein Bild. isolate-override-
Dieses Schlüsselwort wendet das Isolationsverhalten von
isolateauf den umgebenden Inhalt und das Verhalten vonbidi-overrideauf den Inhalt des Elements an. plaintext-
Dieses Schlüsselwort bewirkt, dass die Schreibrichtung des Elements ohne Berücksichtigung des bidirektionalen Zustands seines Elternelements oder des Werts der Eigenschaft
directionberechnet wird. Die Schreibrichtung wird anhand der Regeln P2 und P3 des Unicode-Bidirektionalitätsalgorithmus berechnet. Dieser Wert ermöglicht die Darstellung von Daten, die bereits mit einem Werkzeug formatiert wurden, das dem Unicode-Bidirektionalitätsalgorithmus folgt.
Formale Definition
| Anfangswert | normal |
|---|---|
| Anwendbar auf | Alle Elemente, einige Werte haben keine Wirkung bei non-inline Elementen |
| Vererbt | Nein |
| Berechneter Wert | wie angegeben |
| Animationstyp | Not animatable |
Formale Syntax
unicode-bidi =
normal |
embed |
isolate |
bidi-override |
isolate-override |
plaintext
Beispiele
HTML
<div class="bible-quote">A line of text</div>
<div>Another line of text</div>
CSS
.bible-quote {
direction: rtl;
unicode-bidi: embed;
}
Ergebnis
Spezifikationen
| Spezifikation |
|---|
| CSS Writing Modes Level 4 # unicode-bidi |