本文目錄導(dǎo)讀：

1. 使用text-decoration屬性
2. 使用border-bottom屬性

CSS下劃線設(shè)置詳解

在CSS中，下劃線設(shè)置是一個(gè)常見(jiàn)的需求，通常用于突出顯示文本或增加可讀性，下面我們將詳細(xì)介紹如何設(shè)置CSS下劃線。

使用text-decoration屬性

CSS中的text-decoration屬性可以用于設(shè)置文本的下劃線、上劃線、刪除線等裝飾效果，text-decoration: underline;表示設(shè)置下劃線。

給文本添加下劃線：

p {
text-decoration: underline;
}

使用border-bottom屬性

除了text-decoration屬性外，我們還可以使用border-bottom屬性來(lái)設(shè)置文本的下劃線，border-bottom屬性的值可以是一個(gè)像素值，表示下劃線的粗細(xì)；也可以是一個(gè)顏色值，表示下劃線的顏色。

給文本添加紅色下劃線：

p {
border-bottom: 1px solid red;
}

三、使用box-decoration-break屬性

CSS中的box-decoration-break屬性也可以用于設(shè)置文本的下劃線，該屬性的值可以是slice或clone，分別表示將裝飾效果應(yīng)用到每個(gè)文本行或整個(gè)文本塊。

將下劃線應(yīng)用到每個(gè)文本行：

p {
box-decoration-break: slice;
text-decoration: underline;
}

通過(guò)以上方法，我們可以輕松地在CSS中設(shè)置文本的下劃線，在實(shí)際應(yīng)用中，可以根據(jù)具體需求選擇適合的方法來(lái)實(shí)現(xiàn)下劃線效果。