CSS3的

p before

選擇器允許將樣式應(yīng)用于所選元素的內(nèi)容之前。

.n1::before {
content: "前綴內(nèi)容";
font-weight: bold;
}

以上代碼將在元素前加上“前綴內(nèi)容”，并將其加粗顯示。

在實(shí)際應(yīng)用中，

p before

可用于各種場合，如：

.n2::before {
content: url("path/to/icon.png");
margin-right: 5px;
}

以上代碼將在元素前加上一個(gè)圖標(biāo)，并設(shè)置圖標(biāo)與元素之間的距離。

除此之外，還可以使用

p before

來自動(dòng)生成序號(hào)，以使頁面達(dá)到更好的可讀性。

.n3::before {
content: counter(section) ". ";
counter-increment: section;
}

以上代碼將在每個(gè)元素前自動(dòng)生成序號(hào)，如“1. ”、“2. ”等，并使用counter對(duì)序號(hào)進(jìn)行計(jì)數(shù)。

p before

可用于各種場合，是CSS3的一項(xiàng)強(qiáng)大功能，通過合理使用，我們可以實(shí)現(xiàn)更加豐富多樣的頁面效果。