Unicode-bidi - CSS-trucs | CSS Almanac 2025

De unicode-bidieigenschap is een van de twee CSS-eigenschappen die de weergave van bidirectionele tekst in HTML en vergelijkbare opmaaktalen (bijv. XML) afhandelen. De andere eigenschap is direction, en de twee worden samen gebruikt om niveaus van ingesloten tekst te maken met verschillende tekstrichtingen (van rechts naar links en van links naar rechts) in een enkel DOM-element.

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

De browser bepaalt meestal in welke richting inline tekst zal stromen, afhankelijk van het langattribuut van elementen, de landinstelling van de browser en font-familyvan specifieke elementen. unicode-bidiis handig als een element zowel LTR-tekst als RTL-tekst bevat:

De user-agent past een complex algoritme toe dat is gedefinieerd door de Unicode-standaard om te bepalen hoe de tekst eruit moet zien. Deze eigenschap bepaalt specifiek de insluitingsniveaus en overschrijvingen voor het Unicode bidirectionele algoritme.

De unicode-bidieigenschap heeft drie breed ondersteunde waarden:

het 'normale' trefwoord, dat geen extra niveaus van ingebedde bidirectionele tekst biedt (het standaard browsergedrag). Een element met deze eigenschap bevat alleen LTR- of RTL-tekst.
het trefwoord "embed", waarmee bidirectionele tekst in een element kan worden ingevoerd (bijvoorbeeld RTL-tekst die tussen LTR-tekst stroomt). Dit wordt bepaald door de directioneigenschap en moet worden toegepast op een inline-element.
het trefwoord 'bidi-override', dat hetzelfde werkt als 'insluiten' wanneer het wordt toegepast op inline-elementen. Op blokniveau-elementen overschrijft het het bidirectionele tekstalgoritme van de browser en laat het de tekst binnen alle inline-kinderen stromen, strikt volgens de directioneigenschap.

Punten van belang

De unicode-bidieigenschap is “is bedoeld voor DTD-ontwerpers. Webontwerpers en vergelijkbare auteurs mogen het niet negeren. " Beslis zorgvuldig of u het moet gebruiken.
Hoewel Internet Explorer technisch ondersteunt unicode-bidisinds versie 5.5, zijn er "ernstige bugs met betrekking tot zwevende elementen" en is het gebruik betrouwbaar in IE 8+ (zie hieronder)