<bdo dir=""></bdo>

更新日
仕様 HTML Living Standard
分類 フロー・コンテンツ / フレージング・コンテンツ / パルパブル・コンテンツ
利用場所 フレージング・コンテンツが置ける場所
内容 フレージング・コンテンツ

bdo要素は、テキストの書字方向を上書き指定します。


<bdo dir="ltr">テキストの書字方向を指定します</bdo>
属性 値
グローバル属性（この要素上では、dir属性が特別な意味を持ちます）
dir="" 書字方向 ltr 左から右へを指定
rtl 右から左へを指定
  • 他の要素とは異なり、bdo要素ではdir属性の指定が必須となります。また、値に auto を指定することはできません。

bdo要素は、双方向アルゴリズムを上書きしたい場合に使用します。

例えば、下記の名前の部分に日本語 英語 アラビア語の名前を書き込んだとします。

<p>User 名前 : 2022/12/26</p>

日本語と英語の場合は問題ありませんが、右から左へと表記されるアラビア語の場合は、双方向アルゴリズムの影響によって次のような表示になってしまいます。（名前に続く内容が、本来とは逆の方向に配置されてしまいます）

表示例：User 2022/12/26 :アラビア語の名前

影響を受けている部分でbdo要素を使用すると、次のように本来の配置で表示されるようになります。（左から右への書字方向によって、双方向アルゴリズムを上書きしています）

<p>User 名前 <bdo dir="ltr">: 2022/12/26</bdo></p>

表示例：User アラビア語の名前: 2022/12/26

使用例


<ul style="font-size: 150%;">
<li>User 太郎 : 2022/12/26</li>
<li>User Eric : 2022/12/26</li>
<li>User &#1571;&#1614;&#1587;&#1618;&#1593;&#1614;&#1583; : 2022/12/26</li>
</ul>

<ul style="font-size: 150%;">
<li>User 太郎 : 2022/12/26</li>
<li>User Eric : 2022/12/26</li>
<li>User &#1571;&#1614;&#1587;&#1618;&#1593;&#1614;&#1583; <bdo dir="ltr">: 2022/12/26</bdo></li>
</ul>
表示例
  • User 太郎 : 2022/12/26
  • User Eric : 2022/12/26
  • User أَسْعَد : 2022/12/26
  • User 太郎 : 2022/12/26
  • User Eric : 2022/12/26
  • User أَسْعَد : 2022/12/26