unicode-bidi

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Die unicode-bidi CSS Eigenschaft, zusammen mit der direction Eigenschaft, bestimmt, wie bidirektionaler Text in einem Dokument behandelt wird. Wenn ein Textblock beispielsweise sowohl von links nach rechts als auch von rechts nach links verläuft, verwendet der User-Agent einen komplexen Unicode-Algorithmus, um zu entscheiden, wie der Text angezeigt werden soll. Die unicode-bidi Eigenschaft überschreibt diesen Algorithmus und ermöglicht es dem Entwickler, die Texteinbettung 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 unicode-bidi und direction Eigenschaften sind die einzigen Eigenschaften, die nicht durch die all Kurzform betroffen sind.

Warnung: Diese Eigenschaft ist für Designer von Document Type Definitions (DTD) vorgesehen. Webdesigner und ähnliche Autoren sollten sie nicht überschreiben.

Syntax

css
/* 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 bietet keine zusätzliche Einbettungsebene bezüglich des bidirektionalen Algorithmus. Bei Inline-Elementen funktioniert die implizite Umordnung über die Elementgrenzen hinweg.

embed

Wenn das Element inline ist, öffnet dieser Wert eine zusätzliche Einbettungsebene bezüglich des bidirektionalen Algorithmus. Die Richtung dieser Einbettungsebene wird durch die direction Eigenschaft angegeben.

bidi-override

Für Inline-Elemente wird ein Override erstellt. Für Block-Container-Elemente wird ein Override für Inline-Ebenen-Nachkommen erstellt, die sich nicht innerhalb eines anderen Block-Container-Elements befinden. Dies bedeutet, dass innerhalb des Elements die Umordnung streng in der Reihenfolge gemäß der direction Eigenschaft erfolgt; der implizite Teil des bidirektionalen Algorithmus wird ignoriert.

isolate

Dieses Schlüsselwort zeigt an, dass die Richtung des Elementcontainers berechnet werden soll, ohne den Inhalt dieses Elements zu berücksichtigen. Das Element ist daher von seinen Geschwistern isoliert. Bei der Anwendung seines bidirektionalen Auflösungsalgorithmus behandelt der Container das Element als eines oder mehrere U+FFFC Object Replacement Character, d.h. wie ein Bild.

isolate-override

Dieses Schlüsselwort wendet das Isolationsverhalten des isolate-Schlüsselworts auf den umgebenden Inhalt und das Override-Verhalten des bidi-override-Schlüsselworts auf den inneren Inhalt an.

plaintext

Dieses Schlüsselwort sorgt dafür, dass die Richtung des Elements berechnet wird, ohne den bidirektionalen Zustand seines übergeordneten Elements oder den Wert der direction Eigenschaft zu berücksichtigen. Die Richtung wird unter Verwendung der P2- und P3-Regeln des Unicode-Bidirectional-Algorithmus berechnet. Dieser Wert ermöglicht die Darstellung von Daten, die bereits mit einem Tool formatiert wurden, das dem Unicode-Bidirectional-Algorithmus folgt.

Formale Definition

Anfangswertnormal
Anwendbar aufAlle Elemente, einige Werte haben keine Wirkung bei non-inline Elementen
VererbtNein
Berechneter Wertwie angegeben
AnimationstypNot animatable

Formale Syntax

unicode-bidi = 
  normal            |
  embed             |
  isolate           |
  bidi-override     |
  isolate-override  |
  plaintext

Beispiele

CSS

css
.bible-quote {
  direction: rtl;
  unicode-bidi: embed;
}

HTML

html
<div class="bible-quote">A line of text</div>
<div>Another line of text</div>

Ergebnis

Spezifikationen

Specification
CSS Writing Modes Level 4
# unicode-bidi

Browser-Kompatibilität

Siehe auch