<bdo>: 双方向文字列上書き要素

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.

<bdo> はHTML の要素で、現在のテキストの書字方向を上書きし、中のテキストが異なる書字方向で描画されるようにします。

試してみましょう

<h1>有名な海辺の歌</h1><p>英語の歌 "Oh I do like to be beside the seaside"</p><p>  ヘブライ語では次のように見えます。  <span dir="rtl">אה, אני אוהב להיות ליד חוף הים</span></p><p>  コンピューターのメモリーには、これは次のように格納されます。  <bdo dir="ltr">אה, אני אוהב להיות ליד חוף הים</bdo></p>

html {  font-family: sans-serif;}bdo {  /* ここにスタイルを追加 */}

テキストの文字は指定された方向の開始位置から描画されます。それぞれの文字の向きには影響を与えません（ですから、例えば、文字は裏返しにはなりません）。

属性

この要素にはグローバル属性があります。

dir

この要素の内容において、テキストが描画される方向です。以下の値が指定可能です。

ltr: テキストを左から右へ (left-to-right) 向かわせることを意味する指定。
rtl: テキストを右から左へ (right-to-left) 向かわせることを意味する指定。

例

html

<!-- 書字方向を切り替える --><p>This text will go left to right.</p><p><bdo dir="rtl">This text will go right to left.</bdo></p>

結果

メモ

HTML 4 の仕様では、この要素にイベントが指定されていません。イベントは XHTML で追加されました。これは、恐らく見落としでしょう。

技術的概要

コンテンツカテゴリー	フローコンテンツ,記述コンテンツ, 知覚可能コンテンツ
許可されている内容	記述コンテンツ
タグの省略	なし。開始タグと終了タグの両方が必須です。
許可されている親要素	記述コンテンツを受け入れるすべての要素
暗黙の ARIA ロール	`generic`
許可されている ARIA ロール	すべて
DOM インターフェイス	`HTMLElement`。Gecko 1.9.2 (Firefox 4) 以前では、Firefox はこの要素に対し`HTMLSpanElement` インターフェイスを実装しています。