學(xué)習(xí)計(jì)數(shù)器遇到的問題,兩天搜索找不到相關(guān)資料。問題1:HTML:texttexttextCSS:div{counter-reset:pl;}p::before{content:counter(pl);counter-increment:pl;}p::after{content:counter(pl);}結(jié)果:1text12text23text3因?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é)果2text23text34text4可是。。。卻出現(xiàn)這個(gè)東西。。?!?text23text45text6這是什么意思???問題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é)果:2text24text46text6這個(gè)結(jié)論雖然不是我設(shè)想的,但也貌似懂了,兩個(gè)counter-increment的語義是:計(jì)數(shù)器自增步長=2。于是從0初始,2,4,6...原諒我整天胡思亂想,于是又加一個(gè)counter-increment會出現(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;}是不是步長=3,于是出現(xiàn)3,6,9...可我又被耍了結(jié)果無任何變化,不論我加入多少個(gè)counter-increment,可結(jié)果固定在2,4,6..不變了2text24text46text6這兩天問了不少問題,有時(shí)候在想,有沒有比較靠譜、深入的教程,多些例子、課后題的教程,畢竟w3c太簡略了,MDN每節(jié)也只一個(gè)課后題。每次遇到點(diǎn)問題都來這問,挺麻煩大家的,不好意思。
counter-increment自增多次 無效
炎炎設(shè)計(jì)
2019-05-13 11:25:12