如何設置CSS中的段落行間距

在CSS中，段落行間距的設置可以通過調(diào)整line-height屬性來實現(xiàn)，這個屬性可以指定一個固定的值，也可以設置為相對值，如百分比或em單位。

1. 固定值

如果你想要一個固定的行間距，你可以直接給出一個具體的數(shù)值，如果你想要一個行間距為20像素的段落，你可以這樣寫：

p {
    line-height: 20px;
}

2. 百分比

百分比值是基于當前字體大小來計算的，如果你想要一個行間距為字體大小150%的段落，你可以這樣寫：

p {
    line-height: 150%;
}

3. em單位

em單位是基于當前字體大小的相對單位，如果你想要一個行間距為字體大小1.5倍的段落，你可以這樣寫：

p {
    line-height: 1.5em;
}

示例

下面是一個完整的CSS樣式表示例，展示了如何設置不同段落的行間距：

/* 固定行間距 */
p.fixed-line-height {
    line-height: 20px;
}
/* 百分比行間距 */
p.percent-line-height {
    line-height: 150%;
}
/* em單位行間距 */
p.em-line-height {
    line-height: 1.5em;
}

你可以根據(jù)需要將這些樣式應用到HTML中的相應段落上。

<p class="fixed-line-height">這是一個固定行間距的段落。</p>
<p class="percent-line-height">這是一個百分比行間距的段落。</p>
<p class="em-line-height">這是一個em單位行間距的段落。</p>

通過CSS的line-height屬性，你可以輕松地設置段落行間距，無論是固定值、百分比還是em單位，都能滿足你的排版需求。