CSS - unicode-bidi

トップ > CSSリファレンス > unicode-bidi

概要

属性名 unicode-bidi
normal | embed | [ bidi-override || isolate ] | plaintext
初期値normal
適用可能要素すべての要素
継承継承しない
メディアVisual / Writing Model
サポートC2 / e5 / N6 / Fx1 / Ch2 / Op9.2 / Sa1.3

説明

Unicode で英語や日本語など左から右に書く言語と、アラビア語など右から左に書く言語が混在する場合、多くのブラウザでは文字によって適切に文書の方向を決定する双方向アルゴリズム(bidirectional algorithm)が実装されています。しかし、このアルゴリズムでは期待通りの表示が行われない場合、Unicode によるアルゴリズムを direction で強制的に上書きするか否かを指定します。

説明
normal何も指定しないのと同様の動作を行います。(C2/e5/N6/Fx1/Ch2/Op9.2/Sa1.3)
embed単語の並びを direction の方向に並び替えます。ただし、単語中の文字は並び替えません。(C2/e5/N6/Fx1/Ch2/Op9.2/Sa1.3)
bidi-override単語の並び、単語中の文字の並びを direction の方向に並び替えます。(C2/e5/N6/Fx1/Ch2/Op9.2/Sa1.3)
isolate未稿。(C3)
plaintext未稿。(C3)

使用例

CSS
.sample-normal {
    direction: rtl;
    unicode-bidi: normal;
}
.sample-embed {
    direction: rtl;
    unicode-bidi: embed;
}
.sample-override {
    direction: rtl;
    unicode-bidi: bidi-override;
}
HTML
<h5>normal</h5>
<div>Yamada12 [ <span class="sample-normal">يآمآدآ13 | Yamada14 | يآمآدآ15</span> ] Yamada16</div>
<h5>embed</h5>
<div>Yamada12 [ <span class="sample-embed">يآمآدآ13 | Yamada14 | يآمآدآ15</span> ] Yamada16</div>
<h5>bidi-override</h5>
<div>Yamada12 [ <span class="sample-override">يآمآدآ13 | Yamada14 | يآمآدآ15</span> ] Yamada16</div>
</div>
表示
normal
Yamada12 [ يآمآدآ13 | Yamada14 | يآمآدآ15 ] Yamada16
embed
Yamada12 [ يآمآدآ13 | Yamada14 | يآمآدآ15 ] Yamada16
bidi-override
Yamada12 [ يآمآدآ13 | Yamada14 | يآمآدآ15 ] Yamada16

Copyright (C) 1997-2012 杜甫々
初版:1997年7月27日、最終更新:2012年5月4日
http://www.tohoho-web.com/css/prop/unicode-bidi.htm