有的時候，我們為了實現單行文字的垂直居中，會給line-height一個和height相同的固定的值；有的時候，我們為了調整特定的某段文字的行間距，通常會考慮使用百分比或者相對尺寸的em?；蛟S是習慣，于是我們都習慣了line-height是要有單位的。這些情況下，我們都不需要考慮line-height的繼承，也不會發現任何問題。當然我們在使用line-height繼承的時候，就會發現問題的所在。

例如下面的代碼：

CSS：

<style>
.line-height-test { width: 200px; line-height: 1.4em; font-size: 12px; }
.line-height-test span { font-size: 30px; font-weight: bold; }
</style>

HTML：

<p class=”line-height-test”>
<span>白培銘先生于1960年出生于中國臺灣，畢業于中國臺灣省清華大學核物理系，</span>
之后留學于美國加州大學伯克利分校和密西根大學，獲得雙碩士學位。在工作之后，憑著對營銷領域的濃厚興趣，他又考入密執安大學深造。
</p>

如果line-height屬性值有單位，那么繼承的值則是換算后的一個具體的px級別的值（先計算后繼承）；而如果屬性值沒有單位，則瀏覽器會直接繼承這個 “因子（數值）”，而非計算后的具體值，此時它的line-height會根據本身的font-size值重新計算得到新的line-height 值（先繼承后計算）。

比如有一div及子元素p，div的line-height為150%，由于默認情況的字體大小為16px，所以div的具體line-height值可換算為 16px * 150% = 24px，由于p的line-height會繼承24px這個換算過后的具體值，此時p又被重新定義為font- size:30px;字體大小超過了line-height的大小，于是發生重疊。其它單位原理一樣。