CSS line-height 設定字體範圍高度（行間距）

用 CSS 語法可以設定輕鬆設定文字的行間距，也就是每行之間的距離，讓閱讀起來更加舒適，如果沒有設定 line-height，則每行間的距離以瀏覽器預設的效果呈現，這時候會有一個問題，就是文字大小可能會影響到文章的呈現品質，所以最好還是給 line-height 値比較好。

CSS line-height 基本語法

line-height: 設定値;

設定値的部分可以有 normal（預設值）、數字、高度値（含單位）、百分比以及 inherit（繼承自父層的行高値）等，其中 inherit 建議不要使用，因為舊型 IE 瀏覽器可能不支援，我通常都是使用高度値，看個簡單的範例。

CSS line-height 範例

<span style='line-height: 20px;font-size:13px;'>
　line-height: normal 文字行高設定第一行<br>
　line-height: normal 文字行高設定第二行
</span>

呈現效果如

line-height: normal 文字行高設定第一行
line-height: normal 文字行高設定第二行

範例中我們給 line-height 的値是 20px，這也代表著每行高度為 20px，你也可以嘗試用其它的値帶入範例看結果。要讓文章呈現好的閱讀效果，line-height 通常與 font-size（文字大小）搭配使用，如果沒有設定好文字大小，可能會出現文字重疊的現象。

延伸閱讀