direction: ***; unicode-bidi: ***;

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
プロパティ

direction は基本書字方向を、unicode-bidi はUnicodeの双方向アルゴリズムを制御するプロパティです。


p {
direction: rtl;
unicode-bidi: bidi-override;
}

directionプロパティ

ブロックレベル要素の基本書字方向を指定します。

プロパティ名 説明
direction ltr 左から右へ (初期値)
rtl 右から左へ
  • この設定内容をインライン要素に適用させるには、以下の unicode-bidi プロパティで embed または bidi-override を指定する必要があります。

unicode-bidiプロパティ

Unicodeの双方向アルゴリズムを制御します。(書字方向の組み込み、または上書きを指定することができます)

プロパティ名 説明
unicode-bidi normal 制御しない (初期値)
embed directionプロパティの指定内容を組み込む
bidi-override directionプロパティの指定内容で上書きする

normal
Unicodeの双方向アルゴリズムがそのまま適用されます。
embed
指定した要素がインライン要素の場合は、direction プロパティの指定内容を新たに組み込みます。(文字の並び方は変わりません)
bidi-override
指定した要素がインライン要素、またはインライン要素のみを含むブロックレベル要素の場合は、direction プロパティの指定内容で上書きします。(文字の並び方も上書きされます)

使用例


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>文書のタイトル</title>

<style type="text/css">

p { direction: rtl; }

.example1 { unicode-bidi: embed; }
.example2 { unicode-bidi: bidi-override; }

</style>

</head>
<body>

<p>テキストの「書字方向。」を、右から左へ。</p>

<p>テキストの<span class="example1">「書字方向。」</span>を、右から左へ。</p>

<p class="example2">テキストの「書字方向。」を、右から左へ。</p>

<p>テキストの<span class="example2">「書字方向。」</span>を、右から左へ。</p>

</body>
</html>

表示例

テキストの「書字方向。」を、右から左へ。

テキストの「書字方向。」を、右から左へ。

テキストの「書字方向。」を、右から左へ。

テキストの「書字方向。」を、右から左へ。