unicode-bidi

Updated / Published

unicode-bidiプロパティは言語ごとに決まっている文字の書字方向を組み込んだり、上書き変更することができます。世界中の主だった言語で使用される文字を含んだ国際的なコードである Unicode には言語毎にそれぞれの文字が左から右へと書かれるものなのか、右から左へと書かれるものなのかといった情報が含められており、UA は文書内のテキストを言語毎に自動的に適切な書字方向で表示する双方向アルゴリズムを搭載しているはずです。しかし、その Unicode の双方向アルゴリズムが上手く働かなかった場合、逆に双方向アルゴリズムの働きによって不正確なプレゼンテーションが行われる場合に双方向アルゴリズムを制御するために用います。

値
  • normal
  • embed
  • bidi-override
  • inherit
初期値
normal
適用対象
すべての要素
継承
しない
メディア
visual

unicode-bidiプロパティの値

unicode-bidiプロパティは、基本書字方向と上書き方向を指定する directionプロパティと組み合わせて使います。指定できる値のキーワードはそれぞれ以下の意味を示します。

normal
UA の搭載する Unicode の双方アルゴリズムで言語に応じて適切に表示される。つまり、指定のない場合と同じ。
embed
インライン要素の場合に、双方向アルゴリズムに関して、directionプロパティで指定された方向に書字方向を新たに組み込む。Unocode の双方向アルゴリズムは有効なので、指定された書字方向にテキストの順序が並び替わるだけで、文字の方向は変わらない。
bidi-override
インライン要素か、インライン要素のみを含むブロックレベル要素の場合に、Unicode の双方向アルゴリズムを無効にして、書字方向を上書きする。directionプロパティで上書き方向を指定し、指定された書字方向にテキストの順序が並び替えられ、文字の方向も変わる。

unicode-bidiプロパティと directionプロパティは、ひとつの文書内で日本語とヘブライ語など、書字方向が異なる言語を扱う場合に役立ちます。異なる書字方向が混在する現象を双方向性（bidirectionality）と呼びます。これらのプロパティは装飾目的に使うプロパティではないため、安易に書字方向を変更したりすることはおすすめできません。たとえば、ロボットからメールアドレスの収集を妨げる目的で、アドレスをソース上は逆に記述して、CSS適合 UA では正しく表示される使い方をすすめているようなリソースもありますが、このように特性を濫用した使い方は良くありません。

unicode-bidiプロパティの実装状況

IE
◯
Firefox
◯
Opera
◯
Chrome
◯
Safari
◯
iOS
◯
Android
◯

サンプル

[lang="he"]{
direction : ltr ;
unicode-bidi : bidi-override ;
}
......
<p>「こんにちは」をヘブライ語で、
<bdo  lang="he" dir="ltr">םולש</bdo>（シャローム）といいます。</p>

これらのプロパティは、異なる書字方向の言語が混在する文書の場合に使用するものです。日本語であれば習慣的に左から右の書字方向が身についているため、安易に装飾目的で書字方向を変更するような使い方はおすすめできません。