表示編　7　「文字の均等割付をする」


	ホームページ上での文字の揃え方は一般に3種類あります。「左揃え」「中央揃え」「右揃え」です。これは皆さんもよくご存じではないでしょうか。ここではDTPなどのレイアウトに携わる人ならばよくご存じの「均等割り付け」の揃え方をご紹介いたします。Internet Explorer　バージョン5以上からこの表現がサポートされていますので、文字を多用するページをお持ちの方はチャレンジしてみてはいかが?

文字の均等割付をする

<div style="text-align:justify;text-justify:newspaper">
左右きっちりバランス良い文字並び
</div>

緑色の文字(ここでいう　newspaper　)を text-justify からの属性で割り付けの種類を指定し、割り付けの対象になる文章又は文字列を記述します。(水色の文字の箇所)
このテクニックはInternet Explorer バージョン5からサポートされたスタイルシートの一種。上手く使いこなせば空白の少ないすっきりとした列の形に並ぶ文章が作れます。

割り付けの種類を指定

このテクニックでは5種類の割り付け方法が備わっています。以下に説明しますと、

auto
ブラウザーの動作に任せる

newspaper
最後の行以外を均等割り付け
(改行のタグのある行も割り付け対象の範囲内)

distribute
最後の行以外を均等割り付け

distribute-all-lines
全ての行で均等割り付け

inter-word
単語感覚を調整して均等割り付け
(単語の文字間隔は調整されない)

インラインの要素には適応できない

text-align・text-justifyは
ブロック要素のタグにのみ適応できる。
インライン要素には適応は不可能。

ブロック要素
<DIV>タグや<P>タグ　など

インライン要素(適用不可能)
<SPAN>タグや<B>タグ　など