奇妙的CSS计数器世界主要分为三个部分,在第一部分中介绍了 list-style
的基本使用之外,主要是向大家阐述了如何使用 @counter-style
实现自定义的列表项标记符(list-style-type
);在第二部分中介绍列表标记框,即伪元素 ::marker
的使用以及可用于::marker
上的CSS属性。至此,我们可以在::marker
、::before
和::after
三个伪元素上的content
生成内容,来构建更具个性化的列表项标记符。虽然如此,要实现具有计数(或者说编号)的列表项符号样式,还是需要CSS的计数器来助力,即counter-reset
、counter-increment
和counter()
及counters()
函数。在接下来的内容,主要围绕着这几个属性展开。感兴趣的请继续往下阅读。