CSS3

プロパティ

text-justify

  編集:2022.07.07 by T.A.

mdn

テキストの両端揃え。

名前 text-justify
auto | none | inter-word | inter-character
初期値 auto
適用対象 テキスト
継承 される
百分率 受容しない
算出値 指定されたキーワード
正準的順序 n/a
アニメーション型 離散的

このプロパティは、行の整列(text-align を見よ)が justify に設定されているときに利用される両端揃えメソッドを選定する。このプロパティは、テキストに適用されるが、ブロック コンテナから[行内レベルの内容を包含している根行内ボックス]へ継承される。

auto
ユーザー エージェントは、自身が従う両端揃えアルゴリズムを、処理能と呈示品質との兼ね合いに基づいて、決定する。両端揃え規則は、書記体系言語により様々になるので、ユーザー エージェントは、可能な所では、テキストに適切な両端揃えアルゴリズムを利用するべきである。

¶省く

<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-justify:auto;
">aaaa bbb cc dd ee fff
</DIV>

<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-align:justify;
 text-justify:auto;
">aaaa bbb cc dd ee fff
</DIV>
text-align:justify が必須なようだ

none
両端揃えは不能化される: テキストの中に両端揃え機会はない。

¶図省く

注記: この値は、[可読性を改善する/ アクセス能を目的とする]ような、利用者スタイルシートでの利用が意図されている。

<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-justify:none;
">aaaa bbb cc dd ee fff
</DIV>

inter-word
両端揃えでは、単語分離子の所でのみアキ組を調整する(実質的に、行上の word-spacing の使用値を変えて)。このふるまいは、英語や韓国語の様な、スペースを利用して単語を分離する言語に典型的なものである。

<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-justify:inter-word;
">aaaa bbb cc dd ee fff
</DIV>

<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-align:justify;
 text-justify:inter-word;
">aaaa bbb cc dd ee fff
</DIV>

inter-character
両端揃えでは、各タイポ グラフィック文字単位⇔間のアキ組を調整する(実質的に、行上の letter-spacing の使用値を変えて)。この値は、日本語などの東アジアの体系でときどき利用される。

旧来の理由から、ユーザー エージェントは、正確に同じ意味を持ち、同じふるまいになる、代替キーワード distribute もサポートするものとする。

<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-justify:inter-character;
">aaaa bbb cc dd ee fff
</DIV>

<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-align:justify;
 text-justify:inter-character;
">aaaa bbb cc dd ee fff
</DIV>

distribute
<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-justify:distribute;
">aaaa bbb cc dd ee fff
</DIV>

<DIV lang=en style="border:1px solid red; width:150px; font-size:15px;
 text-align:justify;
 text-justify:distribute;
">aaaa bbb cc dd ee fff
</DIV>

最適な両端揃えは、言語に敏感なので、最良な結果を得るためには、作者は、内容に正しく言語タグをあてがうべきである。

注記: このレベルの CSS による指針では、完全な両端揃えアルゴリズムは、述べられない。それは、完全なアルゴリズムが満たすべき要件が成す最小限の集合にすぎない。要件の集合を制限することで、ユーザー エージェントには、両端揃えアルゴリズムを選ぶ際に ― 必要と欲される[品質、速さ、複雑さ]の兼ね合いを満たすためとして ― ある程度の自由度が与えられる。


テスト
HTML:

ここに表示
¶[Edge]✖?
HTML:

ここに表示
スクリプト:


スクリプト:



表示内容:
表示内容: