這篇文章主要介紹css中怎么設置行間距，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

創(chuàng)新互聯(lián)專注于建鄴企業(yè)網站建設,響應式網站設計,商城網站開發(fā)。建鄴網站建設公司,為建鄴等地區(qū)提供建站服務。全流程定制網站制作，專業(yè)設計，全程項目跟蹤，創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務

首先我們先了解一下什么是行高，在css中又是如何設置行高，進而設置和調整行間距。

簡單來說：行高類似于單線本，單線本里是用一行一行線條隔開的空間，線與線之間的距離就是行高。網頁中的文本文字實際上是寫在一條看不見的線中的，然后會默認在行高中垂直居中顯示。那么在css中是如何設置行高的？在css中可以通過 line-height 屬性來設置行高，下面我們來簡單介紹一下css line-height 屬性吧。

css line-height 屬性會影響行框的布局，是用來設置行與行之間的距離（行高）的，不允許使用負值。在應用到一個塊級元素的時候，它定義了該元素中基線之間的最小距離而不是最大距離。

line-height 與 font-size 的計算值之差（在 CSS 中成為“行間距”）分為兩半，分別加到一個文本行內容的頂部和底部。可以包含這些內容的最小框就是行框。

下面我們來看看css line-height屬性 可能會用的的值：

normal：設置合理的行間距， 默認值。

number：設置數字，此數字會與當前的字體尺寸相乘來設置行間距。

length：設置固定的行間距。

%：基于當前字體尺寸的百分比行間距。

inherit：規(guī)定應該從父元素繼承 line-height 屬性的值。

注：所有瀏覽器都支持 line-height 屬性。

我們來用實例介紹line-height屬性是如何設置和調整行間距，下面會舉例介紹設置行間距的方法：

1、使用數值來設置行間距

	
		
		
		
	
	
		

			這是擁有標準行高的段落。 默認行高大約是 1。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。
		

		

			這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。
		

		

			這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。
		
	

效果圖：

2、使用像素值設置行間距

	
		
		
		
	

	
		

			這是擁有標準行高的段落。 在大多數瀏覽器中默認行高大約是 20px。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。
		

		

			這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。
		

		

			這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。
		
	

效果圖：

3、使用百分比設置行間距

line-height屬性指定了一個百分數，則會相對于字體去計算行高。

	
		
		
		
	

	
		

			這是擁有標準行高的段落。 在大多數瀏覽器中默認行高大約是 110% 到 120%。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。 這是擁有標準行高的段落。
		

		

			這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。 這個段落擁有更小的行高。
		

		

			這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。 這個段落擁有更大的行高。
		
	

效果圖：

以上是css中怎么設置行間距的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道！