text-justify: ***;

ブラウザ
  • IE
プロパティ
  • 独自拡張プロパティ

text-justify は、均等割付の形式を指定するプロパティです。

このプロパティを使用する場合は、text-alignプロパティで justify を指定しておく必要があります。


p {
text-align: justify;
text-justify: distribute-all-lines;
}
プロパティ名 値 説明
text-justify auto 自動
distribute 単語間隔と文字間隔を調整 （タイ語などのアジア言語向け）
distribute-all-lines 途中改行や最終行も調整 （表意文字向け）
inter-word 単語間隔を調整
inter-cluster 単語間隔を持たない言語向け （アジア言語向け）
inter-ideograph 単語間隔と文字間隔を調整（表意文字向け）
newspaper 単語間隔と文字間隔を調整 （英文に最適）
kashida （アラビア語向け） IE 5.5以上
  • 表意文字 … 日本語や中国語などの文字
  • このプロパティは、CSS 2では定義されていません。

使用例


<!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 {
width: 50%;
border: 1px #808080 solid;
text-align: justify;
}

p.example1 { text-justify: auto; }
p.example2 { text-justify: distribute; }
p.example3 { text-justify: distribute-all-lines; }
p.example4 { text-justify: inter-word; }
p.example5 { text-justify: inter-cluster; }
p.example6 { text-justify: inter-ideograph; }
p.example7 { text-justify: newspaper; }
p.example8 { text-justify: kashida; }

</style>

</head>
<body>

<p class="example1">（1）auto<br>日本語と英語の表示例です。...</p>

<p class="example2">（2）distribute<br>日本語と英語の表示例です。...</p>

<p class="example3">（3）distribute-all-lines<br>日本語と英語の表示例です。...</p>

<p class="example4">（4）inter-word<br>日本語と英語の表示例です。...</p>

<p class="example5">（5）inter-cluster<br>日本語と英語の表示例です。...</p>

<p class="example6">（6）inter-ideograph<br>日本語と英語の表示例です。...</p>

<p class="example7">（7）newspaper<br>日本語と英語の表示例です。...</p>

<p class="example8">（8）kashida<br>日本語と英語の表示例です。...</p>

</body>
</html>
表示例

（1）auto
日本語と英語の表示例です。ブラウザの幅を動かすと違いが分かりやすいです。
This is an example of the display in Japanese and English. Move the width of a browser.

（2）distribute
日本語と英語の表示例です。ブラウザの幅を動かすと違いが分かりやすいです。
This is an example of the display in Japanese and English. Move the width of a browser.

（3）distribute-all-lines
日本語と英語の表示例です。ブラウザの幅を動かすと違いが分かりやすいです。
This is an example of the display in Japanese and English. Move the width of a browser.

（4）inter-word
日本語と英語の表示例です。ブラウザの幅を動かすと違いが分かりやすいです。
This is an example of the display in Japanese and English. Move the width of a browser.

（5）inter-cluster
日本語と英語の表示例です。ブラウザの幅を動かすと違いが分かりやすいです。
This is an example of the display in Japanese and English. Move the width of a browser.

（6）inter-ideograph
日本語と英語の表示例です。ブラウザの幅を動かすと違いが分かりやすいです。
This is an example of the display in Japanese and English. Move the width of a browser.

（7）newspaper
日本語と英語の表示例です。ブラウザの幅を動かすと違いが分かりやすいです。
This is an example of the display in Japanese and English. Move the width of a browser.

（8）kashida
日本語と英語の表示例です。ブラウザの幅を動かすと違いが分かりやすいです。
This is an example of the display in Japanese and English. Move the width of a browser.