學(xué)習(xí)計(jì)數(shù)器遇到的問題，兩天搜索找不到相關(guān)資料。

問題 1：

HTML:

<div>
    <p>text</p>
    <p>text</p>
    <p>text</p>
</div>

CSS:

div{counter-reset:pl;}
p::before{content:counter(pl);counter-increment:pl;}
p::after{content:counter(pl);}

結(jié)果：

1text1
2text2
3text3

因?yàn)榻坛躺险f不論何處，每次出現(xiàn)counter-increment計(jì)數(shù)器皆自增,于是修改CSS為：

div{counter-reset:pl;}
p::before{content:counter(pl);counter-increment:pl;}
p::after{content:counter(pl);counter-increment:pl;}

兩個(gè)counter-increment是不是計(jì)數(shù)器自增2次？于是寄希望能出現(xiàn)結(jié)果

2text2
3text3
4text4

可是。。。卻出現(xiàn)這個(gè)東西。。。↓

1text2
3text4
5text6

這是什么意思？？？

問題2：

還是基于上題，這次我把counter-increment單獨(dú)放置

div{counter-reset:pl;}
p::before{content:counter(pl);counter-increment:pl;}
p::after{content:counter(pl);}
p{counter-increment:pl;}

結(jié)果:

2text2
4text4
6text6

這個(gè)結(jié)論雖然不是我設(shè)想的，但也貌似懂了，兩個(gè)counter-increment的語義是：計(jì)數(shù)器自增步長(zhǎng)=2。于是從0初始，2,4,6...

原諒我整天胡思亂想，于是又加一個(gè)counter-increment會(huì)出現(xiàn)什么？

div{counter-reset:pl;}
p::before{content:counter(pl);counter-increment:pl;}
p::after{content:counter(pl);}
p{counter-increment:pl;}
p{counter-increment:pl;}

是不是步長(zhǎng)=3，于是出現(xiàn) 3,6,9...
可我又被耍了
結(jié)果無任何變化,不論我加入多少個(gè)counter-increment,可結(jié)果固定在2,4,6..不變了

2text2
4text4
6text6

這兩天問了不少問題，有時(shí)候在想，有沒有比較靠譜、深入的教程，多些例子、課后題的教程，畢竟w3c太簡(jiǎn)略了，MDN每節(jié)也只一個(gè)課后題。每次遇到點(diǎn)問題都來這問，挺麻煩大家的，不好意思。