在CSS中，我們可以使用字段自動(dòng)編號(hào)來(lái)為頁(yè)面中的元素進(jìn)行編號(hào)，方便我們?cè)谶M(jìn)行樣式設(shè)計(jì)時(shí)進(jìn)行調(diào)用和控制。這種技巧在一些需要大量編號(hào)的網(wǎng)頁(yè)設(shè)計(jì)中尤為有用。
實(shí)現(xiàn)自動(dòng)編號(hào)的基本代碼如下：

p {
counter-reset: section;
}
<br>
p:before {
counter-increment: section;
content: "Section " counter(section) ". ";
}

上述代碼中，我們給p標(biāo)簽設(shè)置了一個(gè)叫做section的計(jì)數(shù)器，然后，我們?cè)趐標(biāo)簽前添加了一個(gè):before偽元素，通過(guò)counter-increment: section;語(yǔ)句，每當(dāng)遇到一個(gè)新的p標(biāo)簽，計(jì)數(shù)器就會(huì)自增1。然后，我們用content屬性來(lái)顯示段落計(jì)數(shù)器的值。
另外，我們還可以在嵌套元素中使用計(jì)數(shù)器，例如：

ol {
counter-reset: section;
list-style-type: none;
}
<br>
li:before {
counter-increment: section;
content: counter(section) ". ";
}

在上述代碼中，我們給ol標(biāo)簽設(shè)置了一個(gè)計(jì)數(shù)器，每當(dāng)遇到一個(gè)li標(biāo)簽時(shí)，計(jì)數(shù)器自增1。然后，在每個(gè)li標(biāo)簽前，我們用:before偽元素來(lái)顯示計(jì)數(shù)器的值。
需要注意的是，計(jì)數(shù)器需要用counter-reset來(lái)進(jìn)行初始化。我們可以選擇在樣式表中初始化所有計(jì)數(shù)器，也可以只針對(duì)特定的元素進(jìn)行初始化，例如在p標(biāo)簽中使用counter-reset: section 2;即可將計(jì)數(shù)器的初始值設(shè)置為2。
通過(guò)使用CSS字段自動(dòng)編號(hào)技巧，我們可以輕松實(shí)現(xiàn)對(duì)網(wǎng)頁(yè)元素的編號(hào)，既美觀又方便，是一項(xiàng)不可或缺的CSS技巧。