Ostatnio edytowany:

unicode-bidi

Autor: Virtual Patriot

Opis właściwości unicode-bidi

Za pomocą właściwości unicode-bidi możemy określić w jaki sposób jeden z mechanizmów przeglądarki internetowej powinien rozwiązać problem dwukierunkowości tekstu interesującego nas elementu HTML.

Dodatkowe techniczne informacje o właściwości unicode-bidi

przeznaczenie

element HTML każdego typu

Wartość embed przeznaczona jest wyłącznie dla elementu HTML występującego na poziomie tekstu.

pozycja

dowolna

dziedziczenie

nie

wartość initial

normal

wyjątki initial

jakikolwiek element HTML posiadający atrybut dir wraz z wartością ltr lub rtl lub auto

animowanie

nie (animacja nieciągła)

Interpretacja właściwości unicode-bidi

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

tak

Edge

tak

Opis wartości właściwości unicode-bidi

normal

Opis

Wartość normal jest domyślną wartością właściwości unicode-bidi.

Domyślnie jeden z mechanizmów przeglądarki internetowej rozwiązuje problem dwukierunkowości tekstu elementu HTML korzystając z góry ustalonego oraz wbudowanego algorytmu.

Przykład

  unicode-bidi:normal;
(Słonecznik Biały) عباد الشمس أبيض 100g.

Problem dwukierunkowości tekstu przykładowego elementu "div" został rozwiązany przez jeden z mechanizmów przeglądarki internetowej na podstawie z góry ustalonego oraz wbudowanego algorytmu.

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        direction:rtl;
        font-size:1.3em;
        background-color:#CBFFFF;
      }
    </style>
  </head>

  <body>

    <div>
      (Słonecznik Biały) عباد الشمس أبيض <b>100g</b>.
    </div>

  </body>
</html>

embed

Opis

Za pomocą wartości embed właściwości unicode-bidi możemy sprawić, że z góry ustalony oraz wbudowany algorytm służący do rozwiązywania problemu dwukierunkowości tekstu elementu HTML zadziała również dla interesującego nas elementu HTML występującego na poziomie tekstu.

Przykład

  unicode-bidi:embed;
(Słonecznik Biały) عباد الشمس أبيض 100g.

Problem dwukierunkowości tekstu przykładowego elementu "span" został rozwiązany przez jeden z mechanizmów przeglądarki internetowej na podstawie z góry ustalonego oraz wbudowanego algorytmu, ponieważ do wspomnianego elementu "span" została dodana właściwość "unicode-bidi" wraz z wartością "embed".

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        font-size:1.3em;
      }

      div > span {
        unicode-bidi:embed;
        direction:rtl;
        background-color:#CBFFFF;
      }
    </style>
  </head>

  <body>

    <div>
      <span>(Słonecznik Biały) عباد الشمس أبيض <b>100g</b>.</span>
    </div>

  </body>
</html>

bidi-override

Opis

Za pomocą wartości bidi-override właściwości unicode-bidi możemy sprawić, że z góry ustalony oraz wbudowany algorytm służący do rozwiązywania problemu dwukierunkowości tekstu elementu HTML będzie ignorowany przez interesujący nas element HTML.

Przykład

  unicode-bidi:bidi-override;
(Słonecznik Biały) عباد الشمس أبيض 100g.

Problem dwukierunkowości tekstu przykładowego elementu "div" nie został rozwiązany przez jeden z mechanizmów przeglądarki internetowej na podstawie z góry ustalonego oraz wbudowanego algorytmu, ponieważ do wspomnianego elementu "div" została dodana właściwość "unicode-bidi" wraz z wartością "bidi-override".

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        unicode-bidi:bidi-override;
        direction:rtl;
        font-size:1.3em;
        background-color:#CBFFFF;
      }
    </style>
  </head>

  <body>

    <div>
      (Słonecznik Biały) عباد الشمس أبيض <b>100g</b>.
    </div>

  </body>
</html>