This page was translated from English by the community.Learn more and join the MDN Web Docs community.
<bdi>
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since январь 2020 г..
Описание
HTML-элемент<bdi> (bidirectional isolation, или изоляция двунаправленности [текста]) изолирует от окружающего текста текстовый фрагмент, направление в котором может отличаться от направления окружающего текста (но не обязательно отличается).
Этот элемент полезен при встраивании текста с неизвестным направлением (например, из базы данных) внутрь текста с заданным направлением.
Примечание:Хотя тот же эффект может быть достигнут применением CSS правилаunicode-bidi: isolate к элементу<span> или другому элементу форматирования текста, семантическое значение передаётся только с помощью элемента<bdi>. Тем более, что браузеры могут игнорировать стили. В этом случае, текст будет отображён корректно при использовании HTML-элемента, и некорректно при использовании только CSS стилей.
| Content categories | Flow content,phrasing content, palpable content. |
|---|---|
| Permitted content | Phrasing content. |
| Tag omission | Нет, открывающий и закрывающий теги обязательны. |
| Permitted parent elements | Any element that acceptsphrasing content. |
| DOM interface | HTMLElement |
Attributes
Like all other HTML elements, this element has theglobal attributes, with a slight semantic difference: thedir attribute is not inherited. If not set, its default value is theauto which let the browser decide the direction based on the element's content.
Example
<p dir="ltr"> This arabic word <bdi>ARABIC_PLACEHOLDER</bdi> is automatically displayed right-to-left.</p>Result
This arabic word REDLOHECALP_CIBARA is automatically displayed right-to-left.
Спецификации
| Specification |
|---|
| HTML # the-bdi-element |
Совместимость с браузерами
Смотрите также
- Related HTML element:
<bdo> - Related HTML properties:
direction,unicode-bidi