10.6　设置行高

行高指的是段落的行距，即段落内每行之间的距离。使用大一些的行高有时候会使主体文本更容易阅读（参见图10.6.1和图10.6.2）。对于超过一行的标题，使用较小的行高则会让它们看起来更美观。

body {
     font-family: "Palatino Linotype", Palatino, serif;
     font-size: 100%;
}
 
h1,
h2 {
     font-family: "Arial Black", Arial, sans-serif;
     font-weight: normal;
}
 
h1 {
     font-size: 1.375em;
}
 
h2 {
     font-size: .9375em;
}
 
p {
     font-size: .875em; /* 16px / 14px */
     line-height: 1.6;
}
 
...

图10.6.1　假设body元素默认大小为16像素，p元素的字体大小为0.875em，即大约14像素。行高将是14像素的1.6倍，即大约22.4像素

图10.6.2　使用line-height拉大行距可以使它们更引人注目，并且更容易阅读

设置行高的步骤

• 输入line-height:。

• 输入n，这里的n是一个数字，它与元素的字体大小相乘，得出需要的行高。（这是最为常用的方法，即一个没有单位的数字。）

或者输入a，这里的a是以em、像素或磅（仅在打印样式表中使用磅）为单位的值。

或者输入p %，这里的p %是字体大小的百分数。

提示　根据下一节将要讲到的，行高可以同字体系列、大小、粗细、字体样式和变体一起进行设置。

提示　如果使用数字设定行高，那么所有的子元素都会继承这个因子。因此，如果父元素的字体大小是16像素（或以em等表示的等价大小），行高是1.5，则该元素的行高就是24（即16×1.5）像素。如果子元素的字体大小是10像素，则该元素的行高就是15（即10×1.5）像素。

提示　如果使用百分数或em值，那么只会继承产生的行高（即计算出来的值）。因此，如果父元素的字体大小是16像素，行高是150%，则该元素的行高就是24像素。所有的子元素都将继承24像素的行高，不管字体大小是多少。