CSS line-height 属性用于设置一个元素的行高（行间距）。通俗来说就是控制相邻两行文字之间的垂直距离。
通常我们会使用line-height属性来设置行与行之间的距离。如果一个元素的line-height值大于font-size的值，那么行高和字体大小值之间的差值会被分割为相等的两份，生成两份“半行间距”，它们会分别被放置在文本的上部和下部，这样内联元素就被居中显示了。可以通过vertical-align属性来改变文本的对齐方式。
如果line-height值小于font-size的值，那么文本的内容可能会溢出元素，两行相邻的文本可能会重叠在一起。
line-height属性的值可以是关键字normal。或者是<number>值，或<length>值，或<percentage>值。
如果line-height属性的值为<number>数据类型值，它通常是无单位的数值。此时行高通过这个无单位值乘以元素的font-size值来得到。通常情况下，这种方法设置line-height的方法是我们首选的方法。使用这种设置行高的方式，在继承情况下不会有异常的情况发生。
例如，如果一个元素的字体大小font-size设置为16像素，而它的line-height设置为120%。那么浏览器计算的行高值为(16px * 120)/100 = 19.2px。如果在该元素中有一个子元素，而子元素的字体大小设置为24像素，行高继承自父元素，那么行高就比字体大小要小，子元素中的文本会重叠在一起。
如果父元素使用无单位的数值作为line-height值，那么子元素继承的是这个无单位的数值，而不是经过计算的行高值。所以以上面的例子为例，父元素的line-height设置为1.2，那么子元素的行高是1.2 * 24px = 28.8px。
所以，建议在使用line-height属性时使用无单位的数值，否则你需要为元素的所有子元素都设置自己的行高。
另外，我们通常会在font属性中设置行高。具体请参考font属性的介绍。
根据规范规定，当line-height属性应用在可替换的内联元素时，不会有任何效果。（可替换元素是指外观和尺寸由外部资源定义的元素，如图像<img>，表单元素<button>，<textarea>，<input>和<select>等。其它的元素都是不可替换的元素）。
如果line-height属性应用在不可替换的内联元素（例如<span>）时，它用于指定line box的高度值。
对于块级元素，line-height属性指定元素内部的line box的最小高度。
官方语法
line-height: normal | <number> | <length> | <percentage> | inherit
参数：
- normal：行高值取决于浏览器的用户代理。根据规范，行高值应该根据字体来设置合适的值，值和
<number>参数意义相同，且大小在1.0-1.2之间。根据元素的font-family属性，桌面浏览器使用的默认值多数为1.2。 - <number>：无单位的<number>数据类型值。实际行高值等于该值乘以元素的font-size。在级联时，子元素继承的
line-height值是这个无单位数值，而不是经过计算后的行高值。数值不允许为负数。 - <length>：使用<length>数据类型来作为值，用于计算line box的高度。
- <percentage>：使用<percentage>数据类型来作为值。实际行高值等于给定百分比值乘以元素的字体大小。在级联时，子元素继承的
line-height值为经过计算后的实际的行高值。百分比值不允许为负数。 - inherit：继承父元素的行高值。
line-height属性的初始值为normal。
应用范围
line-height属性可以应用在所有的元素上。
示例代码
/* 关键字 */
line-height: normal;
/* 无单位值：行高等于这个值乘以字体大小 */
line-height: 3.5;
/* <length> 值 */
line-height: 3em;
/* <percentage> 值 */
line-height: 34%;
line-height: inherit;
使用font属性来设置行高。
font: 16px/1.4 "Microsoft YaHei", sans-serif;
浏览器支持
所有的现代浏览器都支持line-height属性，包括Chrome, Firefox, Safari, Opera, Internet Explorer 以及 Android 和 iOS。
