Layout direction override

概要

テキストの書字方向（左から右、右から左）を制御するプロパティです。アラビア語やヘブライ語などのRTL言語と、英語などのLTR言語が混在するコンテンツの表示制御に使用されます。ただし、HTML文書ではdir属性と<bdo>要素の使用が推奨されており、CSSでの方向制御は特殊なケースに限定されます。

対応ブラウザ

基本構文

.rtl-text {
  direction: rtl;
  unicode-bidi: bidi-override;
}
.isolate {
  unicode-bidi: isolate;
}

実務での使いどころ

• 混合方向テキストの表示制御

  アラビア語と英語が混在するコンテンツで、テキストの方向を正しく制御して読みやすい表示を実現します。

注意点

アクセシビリティ

• 書字方向の設定はスクリーンリーダーの読み上げ順序に影響するため、論理的な読み順序が正しく保たれることを確認してください。

参考リンク

• MDN Web Docs — Layout direction override