CSSunicode-bidi プロパティは、 direction プロパティと共に、文書内の双方向テキストの扱いを指定します。例えば、テキストブロックに左から右 (LTR) 方向と右から左 (RTL) 方向へ記述されるテキストの両方が含まれる場合、ユーザエージェントは、複雑な Unicode アルゴリズムを用いてテキストの表示方法を決定します。このプロパティは、このアルゴリズムを上書きして開発者がテキストの埋め込みを制御できるようにします。

unicode-bididirection プロパティだけは、 all 一括指定プロパティによる影響を受けません。

メモ: このプロパティは DTD デザイナー向けです。ウェブデザイナー等の作者は、このアルゴリズムを上書きすべきではありません。
/* キーワード値 */
unicode-bidi: normal;
unicode-bidi: embed;
unicode-bidi: isolate;
unicode-bidi: bidi-override;
unicode-bidi: isolate-override;
unicode-bidi: plaintext;
/* グローバル値 */
unicode-bidi: inherit;
unicode-bidi: initial;
unicode-bidi: unset;

初期値normal
適用対象すべての要素。ただし一部の値はインラインでない要素には効果がありません
継承なし
メディア視覚
計算値指定値
アニメーションの種類個別
正規順序形式文法で定義される一意のあいまいでない順序

構文

normal
要素は、双方向アルゴリズムを尊重し、追加の埋め込みのレベルを提供しません。インライン要素に対しては、要素の境界に渡って、並べ替え作業を省略します。
embed
要素がインラインの場合、この値は双方向アルゴリズムを尊重し、追加の埋め込みのレベルを開きます。この埋め込みレベルの方向は、direction プロパティにより与えられます。
bidi-override
インライン要素に対しては、この値で上書きされます。ブロックコンテナ要素に対しては、この値でインラインレベルの子孫を上書きし、別のブロックコンテナ要素は上書きしません。これは、要素内部に作用することを意味し、並べ替えは direction による順序に従います。双方向アルゴリズムの省略された部分は無視されます。
isolate
このキーワードは、要素のコンテナの記述方向が、要素の内容を考慮せずに計算されることを示します。要素はその兄弟から 隔離 (isolated) されます。双方向解決アルゴリズムが適用される時、そのコンテナ要素は、対象の要素を 1 個またはいくつかの U+FFFC Object Replacement Character として処理します。つまり、画像要素のように扱います。
isolate-override
このキーワードは、周囲のコンテンツに isolate キーワードの隔離処理を適用し、内部のコンテンツに bidi-override キーワードの上書き処理を適用します。
plaintext
このキーワードは、要素の記述方向を、その親要素の双方向状態や direction プロパティの値を考慮せずに計算します。記述方向は、Unicode Bidirectional Algorithm の P2 および P3 規則を用いて計算されます。
この値により、Unicode Bidirectional Algorithm に従うツールを用いてすでに整形されたデータを表示できます。

形式文法

normal | embed | isolate | bidi-override | isolate-override | plaintext

CSS

.bible-quote {
  direction: rtl; 
  unicode-bidi: embed; 
}

HTML

<div class="bible-quote">
  A line of text
</div>
<div>
  Another line of text
</div>

結果

仕様書

仕様書 状態 備考
CSS Writing Modes Module Level 3
unicode-bidi の定義
勧告候補 plaintext および isolateisolate-override キーワードを追加
CSS Level 2 (Revision 1)
unicode-bidi の定義
勧告 初回定義

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOS 版 SafariSamsung Internet
基本対応Chrome 完全対応 2Edge 完全対応 12Firefox 完全対応 1IE 完全対応 5.5Opera 完全対応 9.2Safari 完全対応 1.3WebView Android 完全対応 1Chrome Android 完全対応 ありEdge Mobile 完全対応 ありFirefox Android 完全対応 4Opera Android 完全対応 8Safari iOS 完全対応 3.1Samsung Internet Android 完全対応 あり
isolateChrome 完全対応 48
完全対応 48
完全対応 16
接頭辞付き 補足
接頭辞付き -webkit- のベンダー接頭辞が必要
補足 Avoiding using -webkit-isolate. It can lock up older versions of Safari (up to version 9) and Chrome (up to version 47).
補足 Since Chrome 19, the syntax from a previous version of the specification, where the isolate keyword could be used together with bidi-override, is allowed.
Edge 未対応 なしFirefox 完全対応 50
完全対応 50
未対応 10 — 54
接頭辞付き 補足
接頭辞付き -moz- のベンダー接頭辞が必要
補足 From Firefox 10 to Firefox 16 (inclusive), the isolate keyword could be used together with bidi-override, which was the syntax from a previous version of the specification. From Firefox 17, only one value is allowed. Use isolate-override instead the previous isolate bidi-override.
IE 未対応 なしOpera 未対応 なしSafari 完全対応 あり
接頭辞付き 補足
完全対応 あり
接頭辞付き 補足
接頭辞付き -webkit- のベンダー接頭辞が必要
補足 Avoiding using -webkit-isolate. It can lock up older versions of Safari (up to version 9) and Chrome (up to version 47).
WebView Android 完全対応 48Chrome Android 完全対応 48Edge Mobile 未対応 なしFirefox Android 完全対応 50
完全対応 50
未対応 10 — 54
接頭辞付き 補足
接頭辞付き -moz- のベンダー接頭辞が必要
補足 From Firefox 10 to Firefox 16 (inclusive), the isolate keyword could be used together with bidi-override, which was the syntax from a previous version of the specification. From Firefox 17, only one value is allowed. Use isolate-override instead the previous isolate bidi-override.
Opera Android 未対応 なしSafari iOS 未対応 なしSamsung Internet Android 完全対応 5.0
plaintextChrome 完全対応 48Edge 未対応 なしFirefox 完全対応 50
完全対応 50
未対応 10 — 54
接頭辞付き 補足
接頭辞付き -moz- のベンダー接頭辞が必要
補足 Before Firefox 50, the plaintext value was ignored for vertical writing modes (bug 1302734).
補足 Before Firefox 15, plaintext didn't do anything to an inline element. The specification changed and the implementation was changed in Firefox 15.
IE 未対応 なしOpera 未対応 なしSafari 未対応 なしWebView Android 完全対応 48Chrome Android 完全対応 48Edge Mobile 未対応 なしFirefox Android 完全対応 50
完全対応 50
未対応 10 — 54
接頭辞付き 補足
接頭辞付き -moz- のベンダー接頭辞が必要
補足 Before Firefox 50, the plaintext value was ignored for vertical writing modes (bug 1302734).
補足 Before Firefox 15, plaintext didn't do anything to an inline element. The specification changed and the implementation was changed in Firefox 15.
Opera Android 未対応 なしSafari iOS 未対応 なしSamsung Internet Android 完全対応 5.0
isolate-overrideChrome 完全対応 48Edge 未対応 なしFirefox 完全対応 50
完全対応 50
未対応 17 — 54
接頭辞付き
接頭辞付き -moz- のベンダー接頭辞が必要
IE 未対応 なしOpera 未対応 なしSafari 未対応 なしWebView Android 完全対応 48Chrome Android 完全対応 48Edge Mobile 未対応 なしFirefox Android 完全対応 50
完全対応 50
未対応 17 — 54
接頭辞付き
接頭辞付き -moz- のベンダー接頭辞が必要
Opera Android 未対応 なしSafari iOS 未対応 なしSamsung Internet Android 完全対応 5.0

凡例

完全対応  
完全対応
未対応  
未対応
実装ノートを参照してください。
実装ノートを参照してください。
使用するには、ベンダー接頭辞または異なる名前が必要です。
使用するには、ベンダー接頭辞または異なる名前が必要です。

関連情報

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

このページの貢献者: mfuji09, Marsf, Sebastianz, ethertank, sosleepy
最終更新者: mfuji09,