HTML辞書ホームへ
HTML要素 辞書 by Sentaro
<bdo>
Bidirectional Override(双方向上書き)要素。テキストの書字方向(左から右、または右から左)を強制的に上書きします。
info
概要
<bdo> 要素は、内包するテキストの書字方向(Bidirectional property)を、Unicodeの双方向アルゴリズムの通常の規則に従わせるのではなく、**強制的に上書き**するために使用されます。
この要素を使用する際は、必ず **dir 属性**(書字方向を指定する属性)を指定する必要があります。
play_circle
デモ (静的表示)
HTML (Source)
<p>
通常のテキスト: This is normal text.
</p>
<p>
<bdo dir="rtl">
This is right to left text.
</bdo>
</p>
Preview (Result)
通常のテキスト: This is normal text.
This is right to left text.
list
属性 (Attributes)
| 属性名 | 説明 |
|---|---|
| dir | **必須属性**。テキストの方向を指定します。ltr: Left-to-Right(左から右)rtl: Right-to-Left(右から左)
|
code
実用例
1. テキストを完全に逆順に表示する
<p>
正しい順序: <bdi>Hello World!</bdi>
</p>
<p>
強制的に逆順: <bdo dir="rtl">Hello World!</bdo>
</p>
2. 右から左への言語の文字列を強制的に逆にする
<!-- アラビア語などのRTL言語の文字列を強制的にLTRにする例 (通常の使用は推奨されません) -->
<p>
<bdo dir="ltr">مرحبا بالعالم</bdo>
</p>
3. 視覚効果としての利用 (非推奨)
<p>
鏡文字: <bdo dir="rtl">Secret Code</bdo>
</p>
lightbulb
知っておくべき重要事項
warning
原則として使用は避けるべき
<bdo> 要素は、Unicodeの双方向アルゴリズムの通常の動作を完全に無視して上書きします。これは、**テキストのセマンティクス(意味)と表現を分離する**というWeb標準の原則に反するため、**やむを得ない特殊な状況**を除いて使用は避けるべきです。
accessibility_new
アクセシビリティへの影響
テキストの表示順序が強制的に変更されるため、スクリーンリーダーや他の支援技術の読み上げ順序が不自然になり、ユーザーの混乱を招く可能性が非常に高いです。アクセシビリティの観点からも、安易な使用は避けるべきです。
テキストの表示順序が強制的に変更されるため、スクリーンリーダーや他の支援技術の読み上げ順序が不自然になり、ユーザーの混乱を招く可能性が非常に高いです。アクセシビリティの観点からも、安易な使用は避けるべきです。