在CSS中，計數器是一個非常有用的工具。它可以幫助我們創建序號和計數，從而讓我們更好地進行網頁設計和排版。下面我們來看一下CSS計數器怎么編排。

/* 聲明計數器名稱和初始值 */
body {
counter-reset: my-counter 0;
}
/* 對目標元素進行計數 */
div:before {
counter-increment: my-counter;
content: counter(my-counter) ". ";
}

以上代碼中，我們首先在body元素中聲明了一個計數器名稱為my-counter且初始值為0。接著在div元素中使用:before偽元素對其進行計數，使用counter-increment屬性進行自動增加操作，并使用content屬性去顯示序號。

如果我們想讓序號從其他數字開始，只需要將初始值改為對應數字即可：

/* 聲明計數器名稱和初始值 */
body {
counter-reset: my-counter 5;
}
/* 對目標元素進行計數 */
div:before {
counter-increment: my-counter;
content: counter(my-counter) ". ";
}

以上代碼中，我們將計數器my-counter的初始值改為5，這樣顯示出來的序號將會從5開始展示。

此外，我們還可以使用計數器來實現某些特殊的效果，例如：

/* 對有序列表的編號進行樣式設置 */
ol {
counter-reset: mylist-counter;
list-style: none;
}
ol >li:before {
counter-increment: mylist-counter;
content: counter(mylist-counter) ". ";
font-weight: bold;
font-size: 18px;
}

以上代碼中，我們使用計數器來對有序列表中的每個li元素進行編號，并對序號進行了樣式設置。

總結來說，CSS計數器可以讓我們更方便地對網頁進行排版和設計，可以實現序號和計數等效果。需要注意的是，在使用計數器時要注意計數器名稱的使用，以及counter-reset和counter-increment兩個屬性的區別和使用。