Autor publikacji
Virtual Patriot - Administrator

bdi

Data publikacji
Ostatnio edytowano

Przeznaczenie elementu bdi

Element bdi reprezentuje zawartość, którą powinna być treść, którą chcemy odizolować od treści reprezentowanej przez zawartość, która opływa dany element bdi, ponieważ istnieje duże prawdopodobieństwo, że jeden z mechanizmów przeglądarki internetowej odpowiedzialny za automatyczne wykrywanie kierunku tekstu wykona błędnie tą czynność.

Dodatkowe artykuły związane z elementem bdi

Informacje techniczne o elemencie bdi

kategoria ogólna
kontekst zewnętrzny

element HTML, który tworzy wewnętrzny kontekst frazowany

Przykładowy Kod HTML

<p>
  <bdi>عباد الشمس أبيض</bdi>: 100g.
</p>

Kontekstem zewnętrznym przykładowego elementu "bdi" jest element "p". Wspomniany element "p" jest jednym z elementów HTML, które tworzą wewnętrzny kontekst frazowany, dlatego w tej sytuacji wspomniany kontekst zewnętrzny, czyli element "p", jest prawidłowym kontekstem zewnętrznym dla elementu "bdi".

kontekst wewnętrzny

zawartość frazowana

Przykładowy Kod HTML

<p>
  <bdi>عباد الشمس أبيض</bdi>: 100g.
</p>

Kontekstem wewnętrznym przykładowego elementu "bdi" jest wyłącznie tekst. Wspomniany tekst jest jednym z elementów, które należą do kategorii zawartość frazowana, dlatego w tej sytuacji wspomniany kontekst wewnętrzny, czyli ciąg znaków "عباد الشمس أبيض", jest prawidłowym kontekstem wewnętrznym dla elementu "bdi".

wymagane elementy dzieci

brak

wymagane atrybuty

brak

zdolność fallback

nie dotyczy

składnia HTML

<bdi> ... </bdi>

pominięcie tagu na początku

nigdy

pominięcie tagu na końcu

nigdy

CSS display

inline

Przypuszczalnie domyślne reguły CSS elementu bdi

/* jeżeli przeglądarka internetowa interpretuje element "bdi" */
bdi {
  unicode-bidi:isolate;
}

Interpretacja elementu bdi

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

nie

Edge

tak

Zobacz więcej informacji o interpretacji elementu .

Opis atrybutów elementu bdi

Atrybut Globalny

dir

Przeznaczenie atrybutu dir

Atrybut dir wykorzystany wraz z elementem bdi pozwala nam określić kierunek, jaki powinien posiadać tekst, który znajduje się w zawartości danego elementu bdi.

Wartość domyślna

auto (w każdej sytuacji)

Wartości atrybutu dir

ltr

Wartość ltr oznacza kierunek od lewej do prawej.

Przykładowy Kod HTML

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

    <p>
      Słonecznik Biały / عباد الشمس أبيض: 100g.
    </p>

    <p>
      <bdi dir="ltr">Słonecznik Biały / عباد الشمس أبيض</bdi>: 100g.
    </p>

  </body>
</html>

Rezultat

Słonecznik Biały / عباد الشمس أبيض: 100g.

Słonecznik Biały / عباد الشمس أبيض: 100g.

Tekst znajdujący się w zawartości przykładowego elementu "bdi" po wyświetleniu w oknie przeglądarki internetowej posiada kierunek od lewej do prawej, ponieważ do wspomnianego elementu "bdi" został dodany atrybut "dir" wraz z wartością "ltr".

rtl

Wartość rtl oznacza kierunek od prawej do lewej.

Przykładowy Kod HTML

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

    <p>
      Słonecznik Biały / عباد الشمس أبيض: 100g.
    </p>

    <p>
      <bdi dir="rtl">Słonecznik Biały / عباد الشمس أبيض</bdi>: 100g.
    </p>

  </body>
</html>

Rezultat

Słonecznik Biały / عباد الشمس أبيض: 100g.

Słonecznik Biały / عباد الشمس أبيض: 100g.

Tekst znajdujący się w zawartości przykładowego elementu "bdi" po wyświetleniu w oknie przeglądarki internetowej posiada kierunek od prawej do lewej, ponieważ do wspomnianego elementu "bdi" został dodany atrybut "dir" wraz z wartością "rtl".

auto

Wartość auto oznacza, że przeglądarka internetowa sama określi kierunek na podstawie pierwszego napotkanego znaku należącego do jakiegokolwiek istniejącego alfabetu oraz znajdującego się w zawartości danego elementu bdi.

Przykładowy Kod HTML

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

    <p>
      Słonecznik Biały / عباد الشمس أبيض: 100g.
    </p>

    <p>
      <bdi dir="auto">Słonecznik Biały / عباد الشمس أبيض</bdi>: 100g.
    </p>

  </body>
</html>

Rezultat

Słonecznik Biały / عباد الشمس أبيض: 100g.

Słonecznik Biały / عباد الشمس أبيض: 100g.

Tekst znajdujący się w zawartości przykładowego elementu "bdi" po wyświetleniu w oknie przeglądarki internetowej posiada kierunek określony przez przeglądarkę internetową na podstawie pierwszego napotkanego znaku należącego do jakiegokolwiek istniejącego alfabetu oraz znajdującego się w zawartości przykładowego elementu "bdi", ponieważ do wspomnianego elementu "bdi" został dodany atrybut "dir" wraz z wartością "auto".