[新着] Webテンプレートを仮オープンしました
direction は文章の表記方向、unicode-bidi はUnicodeの文字の表記方向を制御するプロパティです。
■Unicodeの文字の表記方向（言語ごとの文字の表記方向）
日本語、英語 … 左から右へ
アラビア語、ヘブライ語 … 右から左へ
p {
direction: rtl;
unicode-bidi: bidi-override;
}
■directionプロパティ
文章の表記方向を指定します。
| direction | ltr … （左から右へ）デフォルト |
|---|---|
| rtl … （右から左へ） |
※インライン要素に適用させる場合は、unicode-bidi プロパティで embed または bidi-override を指定する必要があります。
■unicode-bidiプロパティ
文字の並ぶ方向を指定します。
| unicode-bidi | normal … （制御しません）デフォルト |
|---|---|
| embed … （directionの指定内容を組み込みます） | |
| bidi-override … （directionの指定内容で上書きします） |
日本語の文章で direction: rtl （右から左）を指定している場合、
embed … 文字の並び方自体は左から右になります。
bidi-override … 文字の並び方も右から左になります。
<html>
<head>
<title>TAG index Webサイト</title>
<style type="text/css">
<!--
p { direction: rtl; }
.example1 { unicode-bidi: embed; }
.example2 { unicode-bidi: bidi-override; }
-->
</style>
</head>
<body>
<p class="example1">文字の表記方向を、右から左に指定。</p>
<p class="example2">文字の表記方向を、右から左に指定。</p>
<p>文字の<span class="example1">「表記方向」</span>を、右から左に指定。</p>
<p>文字の<span class="example2">「表記方向」</span>を、右から左に指定。</p>
</body>
</html>
▼これをブラウザで見ると次のように表示されます
文字の表記方向を、右から左に指定。
文字の表記方向を、右から左に指定。
文字の「表記方向」を、右から左に指定。
文字の「表記方向」を、右から左に指定。
