此特徵針對區塊元素內含的文字行元素，設定文字行矩格的最小高度。大部分瀏覽器也接受在文字行元素使用此特徵，參見下面的範例。可設為：
- normal：依據字型的高度計算矩格的高度，此為預設值。
- 數值：字型的高度乘上此數值，不可用負數。此項在 Firefox, Safari, Chrome 必須用在區塊元素方有效果，下面實測時使用 SPAN 會失敗；但在 IE6 則可以用在文字行元素。
- 長度：用長度設定矩格的高度，不可用負數。
- 百分比：字型的高度乘上百分比，不可用負數。
- inherit：繼承父元素的特徵值。
- 風格用法：
<span style='line-height: normal; background:#383'> line-height: normal
子曰：有朋自遠方來，不亦樂乎？
子曰：有朋自遠方來，不亦樂乎？</span>
<div style='line-height: 0.7; background:#833'>line-height: 0.7
子曰：學而時習之，不亦說乎？
子曰：學而時習之，不亦說乎？</div>
<span style='line-height: 40px; background:#838'> line-height: 40px
子曰：學而時習之，不亦說乎？
子曰：學而時習之，不亦說乎？</span>
<span style='line-height: 300%; background:#338'> line-height: 300%
子曰：人不知而不慍，不亦君子乎？
子曰：人不知而不慍，不亦君子乎？</span> - 執行結果： line-height: normal
子曰：有朋自遠方來，不亦樂乎？
子曰：有朋自遠方來，不亦樂乎？
line-height: 0.7 子曰：學而時習之，不亦說乎？ 子曰：學而時習之，不亦說乎？line-height: 40px 子曰：學而時習之，不亦說乎？ 子曰：學而時習之，不亦說乎？ line-height: 300% 子曰：人不知而不慍，不亦君子乎？ 子曰：人不知而不慍，不亦君子乎？
- 雖然 line-height 改變了，但背景色所塗區域的高度不變。
- 上例，在 IE8 出現特殊現象，在 SPAN 中加入 BR 分成兩行，相鄰的兩行的顏色不同；但在 IE6, Firefox, Safari, Chrome 是相同顏色。
使用沒有單位的數值，會將此數值比例傳給子元素使用。如果 line-height 使用有單位的長度或百分比，會在宣告的元素節點會換算成實際長度，然後傳給子元素。如果子元素改變 font-size，這時可能會與 line-height 不匹配而發生兩行重疊的現象。參考 Unitless line-heights。
- 風格用法：
<div style='line-height:120%'><span style='font-size:300%'> line-height:120%
font-size:300%
會重疊</span> </div><hr /><div style='line-height:1.2'><span style='font-size:300%'> line-height:1.2
font-size:300%
不會重疊</span> </div> - 執行結果： line-height:120% font-size:300% 會重疊line-height:1.2 font-size:300% 不會重疊
| line-height（你正在看 第一頁） | : | 第一頁 | 第二頁 |
