directionプロパティは当該要素の内容となっているテキストの基本書字方向の指定と、unicode-bidiプロパティで指定された Unicode の双方向アルゴリズムの組み込みと上書き方向を指定します。directionプロパティはテキストの書字方向を指定することで、テーブルのデータセル(td要素)の内容が揃えられる向き、ボックスから内容が水平方向に溢れ出るときの向き、両端揃え(text-align : justify ;)が行われている際のボックス内の最終行で行末まで満たされていないテキストが寄せられる方向などにも影響を与えます。

初期値
ltr
適用対象
すべての要素
継承
する
メディア
visual

directionプロパティの値

directionプロパティに指定できる値のキーワードはそれぞれ以下の意味を示します。

ltr
左から右へ(left to right)
rtl
右から左へ(right to left)

機能としては、(X)HTMLにおける dir属性(bdo要素/共通属性)と同じ働きをするわけですが、dir属性で指定されている書字方向と directionプロパティ、または unicode-bidiプロパティの値が競合した場合、UAdirectionプロパティ、または unicode-bidiプロパティの値よりも、dir属性の値を優先しても良いことになっています。さらには、UA はこれらのプロパティ自体を無視しても良いことになっています。

directionプロパティの実装状況

IE
Firefox
Opera
Chrome
Safari
iOS
Android

サンプル

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

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

Updated / Published