HOME >> スタイルシート > 行の間隔を指定する

point 行の間隔を指定する

line-height:
指定できる値
スタイルシートでの単位
数値にptなどの単位をつけて指定する
比率で指定
数値(単位はつけません)
キーワードで指定
normal 普通の状態
行の間隔を指定するには、line-heightプロパティを使います。
このプロパティは行の間隔を直接指定するわけではなく、文字の大きさに対して一行の高さを指定する事によって、結果的に行に間隔があきます。
わかりやすく言えば、文字の大きさが15mmで行の高さを20mmに設定すれば、5mmの行間が出来ます。値には、数値にptやemなどの単位をつけて指定します。パーセントや比率で親要素に対する相対的な指定方法も出来ます。
比率についてですが、これは単位をつける必要がなく、数値のみで指定します。
line-height:2というように記入すれば、親要素の行の高さ2倍に指定することが出来ます。行の間隔を適度にあけて、読みやすい文章にして下さいね。
サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)

20ptを
指定しました。

40ptを
指定しました。

200%を
指定しました。

2を
指定しました。

ソース
<HTML>
<HEAD>
<TITLE>サンプル</TITLE>
<STYLE type="text/css">
<!--
BODY    { font-size  :10pt; }
.test1	{ line-height:20pt; }
.test2	{ line-height:40pt; }
.test3	{ line-height:200%; }
.test4	{ line-height:2;    }
-->
</STYLE>
</HEAD>
<BODY>
<P class="test1">20ptを<BR>指定しました。</P>
<P class="test2">40ptを<BR>指定しました。</P>
<P class="test3">200%を<BR>指定しました。</P>
<P class="test4">2を<BR>指定しました。</P>
</BODY>
</HTML> 
Copyright ©2001〜2011 まさぼ〜 All Right Reserved