<bdi> HTML

Тег <bdi> (от англ. bidirectional isolation - элемент двунаправленной изоляции) указывает фрагмент текста, который должен быть изолирован от изменения направления вывода текста.

Такое поведение важно для текстов, одновременно содержащих разные языки, читающихся слева направо и справа налево.

Хоть такой же эффект может быть достигнут с использованием CSS правила unicode-bidi: isolate для <span> или другого текстового элемента, семантическое значение достигается только с помощью элемента <bdi>. Более того, браузеры имеют опцию игнорирования стилей. В этом случае, текст будет отображен корректно при использовании HTML элемента, и некорректно при использовании CSS стилей.

Синтаксис

<bdi>Текст</bdi>

Закрывающий тег обязателен.

WAI ARIA

Нет значения role по-умолчанию.

Допустимо любое значение role.

Атрибуты

Для этого элемента доступны универсальные атрибуты и события.

Спецификации

Поддержка браузерами

Настольные

Chrome Firefox IE Opera Safari
Базовая поддержка 16 10.0 Нет Нет Нет

Мобильные

Android Firefox Mobile IE Mobile Opera Mobile Safari Mobile
Базовая поддержка Нет 10.0 Нет Нет Нет

Примеры

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>BDI</title>
    </head>
    <body> 
        <p dir="rtl"><bdi>שבת</bdi> — суббота</p>   
        <p>В ашкеназском произношении звучит как «ша́бос» (идиш «ша́бес»), а в сефардском — как «шаба́т».</p>
    </body>
</html>