为什么以下CSS没有得到正确的部分编号(http://jsfiddle.net/75MHS/)？当我将h3和h4放在div中时,所有章节编号和章节编号总是一个.但是当我删除div容器时,数字都是正确的.
最佳答案它在第二部分中的预期工作(没有div)但在第一部分中没有的原因是由于反作用范围.根据W3C：The scope of a counter starts at the first element in the document that has a ‘counter-reset’ for that counter and includes the element’s descendants and its following siblings with their descendants.
在HTML的后半部分,h3s和h4s是兄弟姐妹,因此,h3上定义的反重置适用于以下h4兄弟.在HTML的第一部分中,h4s不是h3s的后代或兄弟姐妹,反向休息对它们没有影响,因为它们超出了范围.
另一件事是,如果在给定范围内没有定义计数器重置,则每次在内容规则中反计数增加或引用计数器时,它都会假定值为0,这就解释了为什么要获取所有1的计数器. HTML的第一部分：
If ‘counter-increment’ or ‘content’ on an element or pseudo-element refers to a counter that is not in the scope of any ‘counter-reset’,implementations should behave as though a ‘counter-reset’ had reset the counter to 0 on that element or pseudo-element.
如果你必须在div中包装东西,我会：
>为主体上的章节计数器定义计数器重置,这样每次使用计数器增量时都不会为0.
>将h4s嵌套在其父h3s下(这不是很酷)或者让它们成为兄弟姐妹,以确保它们处于正确的范围内.
新HTML：
除了CSS：
body { counter-reset: chapter;}
http://jsfiddle.net/myajouri/QpG9d/ 总结
以上是内存溢出为你收集整理的html – 使用css计数器编号错误全部内容，希望文章能够帮你解决html – 使用css计数器编号错误所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）