### 如何用CSS設置行間距

在CSS中，行間距可以通過`line-height`屬性來調整，這個屬性可以設置為一個具體的像素值，或者設置為相對于字體大小的比例，下面是一些示例：

1. 設置為具體像素值：

```css

p {

line-height: 24px;

}

```

這個例子中，段落（`p`元素）的行間距被設置為24像素。

2. 設置為字體大小的比例：

```css

p {

line-height: 1.5;

}

```

在這個例子中，行間距被設置為字體大小的1.5倍，這種設置方式可以確保在不同字體大小的情況下，行間距始終保持相對一致。

3. 使用單位：

```css

p {

line-height: 2em;

}

```

這里，`em`單位被用來設置行間距，`em`單位等于當前字體的大小，如果字體大小是16像素，行間距將是32像素（16 * 2）。

4. 使用混合單位：

```css

p {

line-height: 1.5em;

}

```

在這個例子中，行間距被設置為字體大小的1.5倍，使用`em`單位可以增加代碼的靈活性。

### 示例代碼

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

```css

/* 設置段落（p元素）的行間距為24像素 */

p {

line-height: 24px;

/* 設置標題（h1元素）的行間距為1.5倍字體大小 */

h1 {

line-height: 1.5;

/* 設置列表（ul元素）的行間距為1.5em */

ul {

line-height: 1.5em;

```

### 應用示例

假設你有一個HTML文檔，包含以下結構：

```html

這是一個段落。

這是一個標題。

• 列表項1
• 列表項2
• 列表項3

```

你可以應用上述CSS樣式表來設置不同元素的行間距，這樣，段落、標題和列表項的行間距就會根據CSS規(guī)則進行調整。