什么是嵌套计数器?
导读: 嵌套计数器 以下实例在页面创建一个计数器,在每一个 元素前添加计数值 "Section .", 嵌套的计数值则放在 元素的前面,内容为 ".": CSS 实例 body { counter-r...
嵌套计数器
以下实例在页面创建一个计数器,在每一个 元素前添加计数值 "Section .", 嵌套的计数值则放在 元素的前面,内容为 ".":
CSS 实例
body {
counter-reset: section;
}
h1 {
counter-reset: subsection;
}
h1::before {
counter-increment: section;
content: "Section " counter(section) ". ";
}
h2::before {
counter-increment: subsection;
content: counter(section) "." counter(subsection) " ";
}
计数器也可用于列表中,列表的子元素会自动创建。这里我们使用了 counters() 函数在不同的嵌套层级中插入字符串:
CSS 实例
ol {
counter-reset: section;
list-style-type: none;
}
li::before {
counter-increment: section;
content: counters(section,".") " ";
}
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: 什么是嵌套计数器?
本文地址: https://pptw.com/jishu/664001.html