Unicode-bidi - CSS-Tricks

Anonim

unicode-bidiNieruchomość jest jedną z dwóch właściwości CSS, które obsługują renderowania tekstu dwukierunkowego w HTML i podobnych języków znaczników opartych na XML (np). Druga właściwość to direction, a obie są używane razem do tworzenia poziomów osadzonego tekstu z różnymi kierunkami tekstu (od prawej do lewej i od lewej do prawej) w jednym elemencie DOM.

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

Przeglądarka zwykle określa kierunek przepływu tekstu w wierszu, w zależności od langatrybutu elementów, ustawień regionalnych przeglądarki i font-familyokreślonych elementów. unicode-bidiprzydaje się, gdy element zawiera zarówno tekst LTR, jak i tekst RTL:

Agent użytkownika stosuje złożony algorytm zdefiniowany przez standard Unicode, aby określić, jak powinien wyglądać tekst. Ta właściwość w szczególności kontroluje poziomy osadzania i przesłonięcia dla dwukierunkowego algorytmu Unicode.

unicode-bidiNieruchomość posiada trzy powszechnie obsługiwane wartości:

  1. słowo kluczowe „normalne”, które nie oferuje żadnych dodatkowych poziomów osadzonego tekstu dwukierunkowego (domyślne zachowanie przeglądarki). Element z tą właściwością będzie zawierał tylko tekst LTR lub RTL.
  2. słowo kluczowe „embed”, które pozwala na dwukierunkowy tekst w elemencie (na przykład tekst RTL przepływający pośród tekstu LTR). Jest to określone przez directionwłaściwość i należy je zastosować do elementu wbudowanego.
  3. słowo kluczowe „bidi-override”, które działa tak samo jak „embed” po zastosowaniu do elementów wbudowanych. W przypadku elementów blokowych przesłania dwukierunkowy algorytm tekstu przeglądarki i przepływa tekst do wszystkich wbudowanych elementów potomnych ściśle według directionwłaściwości.

Ciekawe miejsca

  • unicode-bidiNieruchomość jest „przeznaczony jest dla projektantów DTD. Projektanci stron internetowych i podobni autorzy nie powinni go zastępować. ” Zdecyduj ostrożnie, czy musisz go użyć.
  • Chociaż Internet Explorer obsługuje technicznie unicode-bidiod wersji 5.5, istnieją „poważne błędy związane z elementami pływającymi”, a użycie w IE 8+ jest niezawodne (patrz poniżej)

Wsparcie przeglądarki

Chrom Safari Firefox Opera TO ZNACZY Android iOS
Pracuje Pracuje Pracuje Pracuje 8.0+ Pracuje Pracuje

Powiązane właściwości

Almanach z 5 stycznia 2021 r

kierunek

.element ( direction: rtl; ) Jwahir Sundai Almanac 5 stycznia 2021 r

tryb pisania

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