text-justify CSS3

text-justify は、行の配置が両端揃えに設定されている場合に使用される調整方法を選択します。 (「text-align」参照) このプロパティはインラインに適用されますが、ブロックコンテナからインラインレベルの内容を含む root インラインボックスに継承されます。

名前:text-justify
: auto | none | inter-word | inter-character
初期値:auto
適用対象:インラインボックス
継承:する
パーセンテージ:n/a
メディア:visual(視覚的)
計算値:As specified(指定通り)
正規順序:n/a
アニメーション:discrete(離散的)

Value(値)

auto
初期値 ブラウザに依存CSS3
none
位置調整をしない CSS3
inter-word
単語間隔のみを調整する。これは、英語や韓国語などのスペースを 使用して単語を区切る言語では一般的。CSS3
inter-character
文字間隔を調整する。 日本語などの東アジアのシステムで使用されることがある。CSS3

HTML source

<!DOCTYPE html>
<html>
 <head>
  <title></title>
  <style>
   p {
   text-align:justify;
   font-size:40pt;
   }
   .test1 { text-justify: auto; }
   .test2 { text-justify: none; }
   .test3 { text-justify: inter-word; }
   .test4 { text-justify: inter-character; }
   </style>
 </head>
 <body>
   <p class="test1"><span>日本語 Latin text ภาษาไทย</span></p>
   <p class="test2"><span>日本語 Latin text ภาษาไทย</span></p>
   <p class="test3"><span>日本語 Latin text ภาษาไทย</span></p>
   <p class="test4"><span>日本語 Latin text ภาษาไทย</span></p>
 </body>
</html>

display (text-justify:auto;)

日本語 日本語 Latin text Latin text ภาษาไทย ภาษาไทย

display (text-justify:none;)

日本語 日本語 Latin text Latin text ภาษาไทย ภาษาไทย

display (text-justify:inter-word;)

日本語 日本語 Latin text Latin text ภาษาไทย ภาษาไทย

display (text-justify:inter-character;)

日本語 日本語 Latin text Latin text ภาษาไทย ภาษาไทย

上に戻る