Want to share your CSS expertise with others? Apply to the MDN Fellowship by April 1! http://mzl.la/MDNFellowship

mozilla
Your Search Results

    :dir

    これは実験段階の機能です。
    この機能は複数のブラウザで開発中の状態にあります。各ブラウザで用いるために、適切なベンダー接頭辞が必要な場合があります。互換性テーブルをチェックしてください。また、実験段階の機能の構文と挙動は、仕様変更に伴い各ブラウザの将来のバージョンで変更になる可能性があることに注意してください。

    概要

    CSS 擬似クラスである :dir は、要素に含まれるテキストの方向にマッチします。HTML では方向は dir 属性から判断されます。他の文書タイプには、言語を判断する別の方法があるかもしれません。

    擬似クラス :dir() を使うのと、 [dir=…] 属性セレクタを使うのとは同じでないことに注意してください。後者は dir の値にマッチしますが、属性がセットされていなければ、要素が親要素の値を継承していてもマッチしません。同様に[dir=rtl][dir=ltr] は、dir 属性に auto 値が使われているとマッチしません。一方、:dir() はユーザーエージェントの計算値、継承値、もしくは auto 値にマッチします。

    :dir() はまた、ほとんどの HTML 文書で定義される、文書構造上の意味を持つ (semantic)方向値だけを判断材料にします。direction のような CSS プロパティでセットされる、文体装飾としての (stylistic) 方向は判断材料としません。

    構文

    element:dir(directionality) { CSS プロパティ }
    

    ここで directionality は ltr または rtl です。

    <div dir="rtl">
      <span>test1</span>
      <div dir="ltr">test2
        <div dir="auto">עִבְרִית</div>
      </div>
    </div>
    

    この例の :dir(rtl) は、最上位階層の div、test1 を含む span、そしてヘブライ語の文字を含む div にマッチします。:dir(ltr)test2 を含む div にマッチします。

    仕様

    仕様書 策定状況 コメント
    Selectors Level 4 草案 初回定義

    ブラウザ対応状況

    機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
    基本サポート 未サポート 17 (17)
    18 (18) -moz
    未サポート 未サポート 未サポート
    機能 Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    基本サポート 未サポート 17.0 (17)
    18.0 (18) -moz
    未サポート 未サポート 未サポート
    • 言語に関連する擬似クラス: :lang, :dir

    ドキュメントのタグと貢献者

    Contributors to this page: sosleepy
    最終更新者: sosleepy,
    サイドバーを隠す