Qarpeo LogoInstitute

<bdo>

The HTML <bdo> element allows you to change the default text direction for a specific section, using the dir attribute to control bidirectional text display.

<bdo> Tag

The <bdo> element is used to override the default text direction, ensuring that the enclosed text is displayed in a specific direction, regardless of the surrounding content.

Syntax

index.html
<bdo dir="ltr">Text</bdo>

bdo Demo

Famous seaside songs

The English song "Oh, I do like to be beside the seaside."

In Hebrew, it appears as: אה, אני אוהב להיות ליד חוף הים

In memory, it is stored as: אה, אני אוהב להיות ליד חוף הים

index.html
<h1>Famous seaside songs</h1>
<p>
  The English song "Oh, I do like to be beside the seaside."
</p>
<p>
  In Hebrew, it appears as: <span dir="rtl">אה, אני אוהב להיות ליד חוף הים</span>
</p>
<p>
  In memory, it is stored as: <bdo dir="ltr">אה, אני אוהב להיות ליד חוף הים</bdo>
</p>

Definition and Usage

BDO stands for Bidirectional Override.

The <bdo> tag forces the enclosed text to be displayed in a specific direction, regardless of the surrounding text's orientation.

Text within the <bdo> tag will follow the direction specified by the dir attribute, regardless of the surrounding content.

Attributes

The <bdo> element supports global attributes, including:

  • dir: Defines the text direction. Possible values:
    • ltr: Text flows from left to right.
    • rtl: Text flows from right to left.

Conclusion

The <bdo> (Bidirectional Override) element provides explicit control over text direction, ensuring that content is displayed correctly in languages with different reading directions. It is particularly useful for properly formatting right-to-left RTL languages like Arabic or Hebrew within left-to-right LTR content. By using the dir attribute, you can enforce a specific text direction (ltr or rtl), making this tag an essential tool for managing bidirectional text in multilingual web content.

<bdi>

The HTML <bdi> element isolates text for bidirectional formatting, ensuring that its content remains unaffected by the text direction around it, which aids proper display in mixed-direction scenarios.

<big>

The HTML <big> element was used to enlarge font size, but it is now deprecated. CSS is preferred for managing text size and style.