bdi要素はHTML5から新たに追加された要素です。

bdi要素は、周囲のテキストとは書字方向が異なるテキストを表します。デフォルトだとdir属性はautoであり、要素のコンテンツに応じて書字方向が決定されます。CSSでも同様の効果が期待できる方法がありますが、その書字方向にセマンティクスが伴っている場合はbdi要素を用いるべきです。

使用例

<p dir="ltr">Hello world!をアラビア語で表現すると <bdi>مرحبًا بالعالم!</bdi> になります。</p>

使用可能な属性

  • すべてのグローバル属性
    • ただし、dir属性は他の要素と異なり継承されません

コンテンツカテゴリ

  • フローコンテンツ
  • フレージングコンテンツ
  • パルパブルコンテンツ

子要素にしていい要素の種類

  • フレージングコンテンツ

親要素にしていい要素の種類

  • 子要素にフレージングコンテンツが期待されているすべての要素

仕様書と策定状況

仕様書 策定状況
W3C 勧告
WHATWG Living Standard
最終更新:2016年11月4日

ミツエーリンクスでは、デジタルメディアにおける企業と顧客とのコミュニケーション課題を解決する、さまざまなサービスをご提供しています。ぜひ一度サービスページをご覧ください。

関連情報