bdi 要素

概要

HTML の双方向アイソレート要素(<bdi>) は、他部位とは異なる書字方向で書式設定するテキストの範囲を表します。

この要素は、書字方向が一定のページに対し書字方向が不定の文字列をデータベースから動的に取得して埋め込む際に、その文字列の書字方向を指定して表示する際に有益です。

同様の表示は <span> か他のインライン要素に対し CSS の unicode-bidi プロパティを用い、値に isolate を指定する事で実現可能ですが、その書字方向にセマンティクスを伴う場合には <bdi> 要素が適しています。特に、ブラウザは CSS スタイルを無視することができます。このような場合、テキストは HTML 要素を使用して適切に表示されますが、セマンティクスを伝えるための CSS スタイルの指定は無意味なものになってしまいます。

属性

この要素は、他の全ての HTML 要素と同様にグローバル属性を持ちますが、他の要素と異なり、dir 属性が継承されません。無指定の場合の初期値は auto となり、ブラウザは要素の内容に基づいてその書字方向を決定します。

<p dir="ltr">このアラビア語の <bdi>ARABIC_PLACEHOLDER</bdi> は左から右に向かって文字がレンダリングされます。</p>

表示結果

このアラビア語の REDLOHECALP_CIBARA は左から右に向かって文字がレンダリングされます。

仕様

仕様書 策定状況 コメント
WHATWG HTML Living Standard Living Standard  
HTML5 勧告候補  

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート 16 10.0 (10.0) 未サポート 未サポート 未サポート
機能 Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート 未サポート 10.0 (10.0) 未サポート 未サポート 未サポート

関連情報

  • 関連 HTML 要素: <bdo>
  • 関連 CSS プロパティ: direction
  • セマンティクスを伴わずに同じ視覚効果を得る CSS プロパティ: unicode-bidi

Document Tags and Contributors

Contributors to this page: ethertank, yyss
最終更新者: yyss,