CSSにおける単位なしline-heightの値

プロパティ line-height の値は、必ずしも単位付きの数値である必要はありません。単なる数値や小数でも指定できます。この場合、実際の line-height の値は、その数値に font-size の値を掛けることで求められます。

例えば、 font-size が 10px で、 line-height が 1.5 の場合です。このとき、実際の line-height の値は 10px * 1.5 = 15px になります。そして、テキスト行間の見える空白部分は 5px になります： 15px - 10px = 5px。

この方法で line-height を指定する利点は、フォントサイズを変更すると、行間も自動的に変更されることです。

以下に、説明した内容の適用例を示します：

<p>
	some long text
</p>

p {
	font-size: 20px;
	line-height: 1.5;
	text-align: justify;
	width: 400px;
}

段落のフォントサイズが 30px であるとします。段落間の見える空白部分が 15px になるように、 line-height プロパティを設定してください。その際、単位なしの line-height の値を使用してください。