小編給大家分享一下CSS中l(wèi)ine-height屬性設(shè)置行間距的方法是什么，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！
CSS中行間距的實(shí)現(xiàn)需要line-height屬性。
字符間的間隔太大或者太窄有時可能不太確定，我們需要根據(jù)網(wǎng)站的需要來進(jìn)行調(diào)整，而使用CSS的line-height屬性可以調(diào)整字符間的距離。
我們下面來看具體的示例
我們先來創(chuàng)建以下的HTML代碼（瀏覽器默認(rèn)尺寸為16px）
HTML代碼
冬天的百草園比較的無味；雪一下，可就兩樣了。拍雪人（將自己的全形印在雪上）和塑雪羅漢需要人們鑒賞，這是荒園，人跡罕至，所以不相宜，只好來捕鳥。薄薄的雪，是不行的；總須積雪蓋了地面一兩天，鳥雀們久已無處覓食的時候才好。掃開一塊雪，露出地面，用一支短棒支起一面大的竹篩來，下面撒些秕谷，棒上系一條長繩，人遠(yuǎn)遠(yuǎn)地牽著，看鳥雀下來啄食，走到竹篩底下的時候，將繩子一拉，便罩住了。
先生讀書入神的時候，于我們是很相宜的。有幾個便用紙糊的盔甲套在指甲上做戲。我是畫畫兒，用一種叫作“荊川紙”的，蒙在小說的繡像上一個個描下來，象習(xí)字時候的影寫一樣。讀的書多起來，畫的畫也多起來；書沒有讀成，畫的成績卻不少了，最成片斷的是《蕩寇志》和《西游記》的繡像，都有一大本。
接下來我們在CSS中應(yīng)用line-height屬性
我們首先把line-height屬性的值設(shè)置normal
CSS代碼
重慶分公司
重慶分公司
p.sample1 {line-height:normal; }
p.sample2 {line-height:normal; }這個狀態(tài)為默認(rèn)情況下的個狀態(tài)，所以字符間距沒有改變
效果如下
下面我們用以下三個單位分別來設(shè)置行間距
用px設(shè)置
CSS代碼如下
p.sample1 {line-height:20px; }
p.sample2 {line-height:50px; }在瀏覽器上顯示效果如下。用line-height設(shè)置數(shù)值（這里是默認(rèn)的16 px）會把數(shù)值上下均等地分配。因此，數(shù)值越大，行的間隔也越大。
用em設(shè)置
接下來是以單位em（Em）設(shè)置行間距的例子。em是以font - size屬性指定的大小為1的單位，沒有在父元素中被指定的情況下為1 em = 16px。
CSS代碼如下
p.sample1 {line-height:2em; }
p.sample2 {line-height:4em; }在瀏覽器上顯示效果如下
這里指定的值越大，行間距越大。默認(rèn)為16px，其中2em = 32 px、4em = 64px。
用%設(shè)置
最后用%設(shè)置。以font-size屬性指定的大小為100%，用指定的%的數(shù)值設(shè)置行間距。如果沒有被設(shè)置的父元素的話，100% = 16px。
CSS代碼如下所示
p.sample1 {line-height:150%; }
p.sample2 {line-height:200%; }在瀏覽器上顯示如下效果
看完了這篇文章，相信你對CSS中l(wèi)ine-height屬性設(shè)置行間距的方法是什么有了一定的了解，想了解更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點(diǎn)與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
