http://www.css88.com/archives/1311
关于使用line-height的基本语法和单行文本的垂直居中问题可以查看这里，原文地址： http://www.css88.com/archives/1304
line-height的属性值:
normal 默认。设置合理的行间距。
number 设置数字，此数字会与当前的字体尺寸相乘来设置行间距。 例如：line-height:1.5;
length 设置固定的行间距。 例如：line-height:18px;
% 基于当前字体尺寸的百分比行间距。 例如：line-height:150%;
line-height是可以继承的，由于这个特性，子元素就可以不用重复定义line-height了,假设一段文字的line-height:200%;font-size:12px;那么行高应该是24px；而当装在这段文字的容器有子元素的时候，子元素会继承line-height:200%的属性。但是假设这个子元素的字体改变的时候，比如字体一下子到font-size:54px;的时候，比肯能回想到行高应该是108px（54*200%），其实错了。(转载请注明出处：WEB前端开发 http://www.css88.com/)
例如代码：
<div style=" line-height:200%;font-size:12px;"><code>line-height:200%;font-size:12px;</code> <pre style="font-size:54px;"> line-height的继承问题 line-height的继承问题 line-height的继承问题</pre></div>
我们看看截图：
有的时候，我们为了实现单行文字的垂直居中，会给line-height一个和height相同的固定的值；有的时候，我们为了调整特定的某段文字的行间距，通常会考虑使用百分比或者相对尺寸的em或者px。这些情况下，我们都不需要考虑line-height的继承，所以我们不会发现任何问题。(转载请注明出处：WEB前端开发 http://www.css88.com/)
那么我们在回去看line-height的属性值，normal ，length，%，3个在子元素的字体改变的时候都不能正常显示了，那么number呢，例如：line-height:1.5;此数字会与当前的字体尺寸相乘来设置行间距。
请看demo页面：http://www.css88.com/demo/line-height/line-height.html
看过例子后，你会发现，只要有单位或百分比的line-height继承，都发生了重叠的现象。那到底这是什么原因导致的呢？
如果line-height属性值有单位或百分比，那么继承的值则是换算后的一个具体的px级别的值；而如果属性值没有单位，则浏览器会直接继承这个“因子（数值）”，而非计算后的具体值，此时它的line-height会根据本身的font-size值重新计算得到新的line-height 值。(转载请注明出处：WEB前端开发 http://www.css88.com/)
这种情况碰到最多的博客，留言，论坛等地反，因为这些地方大多有设置字体大小的功能。
另外：
今天在测试的页面的时候还发现一个ie的bug，就是{line-height:150%;font-size:12px;}、{line-height:18px;font-size:12px;}、{line-height:1.5;fon-size:12px;}在页面呈现的时候居然高度不一样，{line-height:18px;font-size:12px;}、{line-height:1.5;fon-size:12px;}呈现的都是18px，而{line-height:150%;font-size:12px;}呈现的却是19px；
其他色数值，例如{line-height:24px;font-size:12px;}、{line-height:200%;font-size:12px;}、{line-height:2;font-size:12px;}又是相等的24px。这是搞不懂IE了。
请看demo页面：http://www.css88.com/demo/line-height/line-height2.html
郁闷的很，我不知道是什么原因，这也正是今天我彻底研究line-height的原因。
4 条评论
是不是奇数1.5的问题呢？
我也遇到这样的问题，还没解决，郁闷ing
刚才截图试了一下，你的行高计算有错误吧，应该从基线开始，刚好就是28px,再减去10px的空距，就是18嘛，对的啊，你的对于行高计算基线有问题吧！
看不太懂你说的是什么 语言组织能力太差了 讲的没有一点条理
5 个引用通告
[...] PS:关于line-height的设置，推荐一下码头写的《line-height的继承问题》 [...]
[...] remaining essentially unchanged.PS:关于line-height的设置，推荐一下码头写的《line-height的继承问题》清晰的强调文字em{ font-style:italic} #demo5{ width:400px;} #demo5:first-letter{ [...]
[...] From – http://www.css88.com/archives/1311 [...]
[...] PS:关于line-height的设置，推荐一下码头写的《line-height的继承问题》 [...]
[...] PS:关于line-height的设置，推荐一下码头写的《line-height的继承问题》 [...]