HTML5タグ辞典 <bdi> | HTML5タグ辞典
最終更新日: 2021年 5月 20日

<bdi> | HTML5タグ辞典

<bdi> ~ </bdi>

bdi要素は記述方向が異なる一部のテキストを隔離する(記述方向のアルゴリズムをその箇所のみ区分けする)ための要素です。

例えば、左から右に向かって記述する日本語の文章の中に、右から左に向かって表記するアラビア文字を記述する際に使用します。

これは、表記方法が異なる2つの言語を同時に記述した場合に起こる意図とは異なる表示を回避するためです。

下記は、ある年のグレゴリオ暦、和暦、ヒジュラ暦を並べて記述したものです。

Gregorian calendar:2000
和暦:H12
التقويم الهجري:1421

アラビア語で記述されているヒジュラ暦のみ記述方向が異なるのが分かります。

このような場合にbdi要素を使用すると記述方向を揃えることができます。bdi要素で囲ったテキストのみが他のテキストと隔離され、その箇所のみにその言語独自の記述方向が適用されるからです。

記述例

Gregorian calendar:2000
和暦:H12
التقويم الهجري:1421

表示

Gregorian calendar:2000
和暦:H12
التقويم الهجري:1421

属性

bdi要素で使用可能な属性は下記の通りです。

記事カテゴリ