“bdi”要素:書字方向が異なるテキスト

要素について

“bdi”要素はまわりのテキストとは書字方向が異なるテキストであることを示す要素です。

通常テキストはそれぞれの文字にもともと設定されている書字方向に従って“双方向アルゴリズム”により並ぶ順番が決められています。しかし、書字方向が異なる文字が混在したテキストでは“双方向アルゴリズム”によって数字や記号などの書字方向が曖昧な文字がその前後の文字に影響されて正しい順番にならないことがあります。“bdi”要素によって前後のテキストから分離することでこの問題を解消することができます。

“dir”属性を指定しない場合は“bdi”要素の内容の書字方向はその文字に設定されている書字方向に従って決められます。

書字方向が一定のテキストの中に書字方向が異なる可能性があるテキストをユーザーの入力などで埋め込む場合などに有効です。

サンプルコード

<ul>

<li><bdi>ﺗﺎﺭﻭﺃﻭ</bdi>:明日は何時に来られる？</li>
<li><bdi>ﻫﺎﻧﺎﻛﻮ</bdi>:12時ぐらい。</li>
<li><bdi>ﺗﺎﺭﻭﺃﻭ</bdi>:3号館の前に集合ね。</li>
<li><bdi>ﻫﺎﻧﺎﻛﻮ</bdi>:わかった。</li>

</ul>

• ﺗﺎﺭﻭﺃﻭ:明日は何時に来られる？
• ﻫﺎﻧﺎﻛﻮ:12時ぐらい。
• ﺗﺎﺭﻭﺃﻭ:3号館の前に集合ね。
• ﻫﺎﻧﺎﻛﻮ:わかった。

“bdi”要素によって双方向アルゴリズムを分離しない場合、右から左へ書くアラビア語に影響されて書字方向が曖昧な記号(“:”)と数字が右から左へ書く文字であると判定されてしまうため本来右側へ並ぶはずのものが左側へ配置されてしまいます。

<ul>

<li>ﺗﺎﺭﻭﺃﻭ:明日は何時に来られる？</li>
<li>ﻫﺎﻧﺎﻛﻮ:12時ぐらい。</li>
<li>ﺗﺎﺭﻭﺃﻭ:3号館の前に集合ね。</li>
<li>ﻫﺎﻧﺎﻛﻮ:わかった。</li>

</ul>

• ﺗﺎﺭﻭﺃﻭ:明日は何時に来られる？
• ﻫﺎﻧﺎﻛﻮ:12時ぐらい。
• ﺗﺎﺭﻭﺃﻭ:3号館の前に集合ね。
• ﻫﺎﻧﺎﻛﻮ:わかった。

属性と値

グローバル属性の“dir”属性は“bdi”要素に指定した場合は他の要素に指定した場合と意味合いが異なります。

仕様書

“bdi”要素はHTML5から定義されている要素です。現行の仕様であるHTML Living Standardでも定義されています。

定義されている仕様書

<bdi>

dir=""