css如何設(shè)置行距？其實(shí)在css并沒有一個(gè)直接設(shè)置行間距的方式，只能通過間接的設(shè)置行高來實(shí)現(xiàn)行間距效果，行高越大就表明行間距越大。本章就給大家介紹css中是怎樣通過設(shè)置行高來屬性行間距效果的，讓大家可以了解css文本文字的行間距是如何調(diào)整的。有一定的參考價(jià)值，有需要的朋友可以參考一下，希望對你們有所幫助。
首先我們先了解一下什么是行高，在css中又是如何設(shè)置行高，進(jìn)而設(shè)置和調(diào)整行間距。
簡單來說：行高類似于單線本，單線本里是用一行一行線條隔開的空間，線與線之間的距離就是行高。網(wǎng)頁中的文本文字實(shí)際上是寫在一條看不見的線中的，然后會默認(rèn)在行高中垂直居中顯示。那么在css中是如何設(shè)置行高的？在css中可以通過 line- 屬性來設(shè)置行高，下面我們來簡單介紹一下css line- 屬性吧。
css line- 屬性 會影響行框的布局，是用來設(shè)置行與行之間的距離（行高）的css設(shè)置表格行的高度，不允許使用負(fù)值。在應(yīng)用到一個(gè)塊級元素的時(shí)候css設(shè)置表格行的高度，它定義了該元素中基線之間的最小距離而不是最大距離。
line- 與 font-size 的計(jì)算值之差（在 CSS 中成為“行間距”）分為兩半，分別加到一個(gè)文本行內(nèi)容的頂部和底部。可以包含這些內(nèi)容的最小框就是行框。
下面我們來看看css line-屬性 可能會用的的值：
我們來用實(shí)例介紹line-屬性是如何設(shè)置和調(diào)整行間距，下面會舉例介紹設(shè)置行間距的方法：
1、使用數(shù)值來設(shè)置行間距
使用數(shù)值來設(shè)置行間距
這是擁有標(biāo)準(zhǔn)行高的段落。 默認(rèn)行高大約是 1。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。
這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。
這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。
效果圖：
2、使用像素值設(shè)置行間距
使用數(shù)值來設(shè)置行間距
這是擁有標(biāo)準(zhǔn)行高的段落。 在大多數(shù)瀏覽器中默認(rèn)行高大約是 20px。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。
這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。
這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。
效果圖：
3、使用百分比設(shè)置行間距
line-屬性指定了一個(gè)百分?jǐn)?shù)，則會相對于字體去計(jì)算行高。
使用數(shù)值來設(shè)置行間距
這是擁有標(biāo)準(zhǔn)行高的段落。 在大多數(shù)瀏覽器中默認(rèn)行高大約是 110% 到 120%。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。 這是擁有標(biāo)準(zhǔn)行高的段落。
這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。 這個(gè)段落擁有更小的行高。
這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。 這個(gè)段落擁有更大的行高。
效果圖：
總結(jié)：以上就是本篇文的全部內(nèi)容，希望能對大家的學(xué)習(xí)有所幫助。更多相關(guān)教程請我！！！