counters CSS |css3 曲线阴影

/* 定义计数器 myCounter */
body {
counter-reset: myCounter;
}
/* 增加计数器 myCounter */
h2:before {
counter-increment: myCounter;
content: counter(myCounter) " ";
}

使用counters属性，大家甚至可以在一个元素中同时使用多个计数器。同时，大家还可以更改计数器的编号格式来更好地满足大家的需求。

/* 定义2个计数器 */
body {
counter-reset: chapter section;
}
/* 章节标题 */
h2:before {
counter-increment: chapter;
content: "Chapter " counter(chapter) ". ";
}
/* 小节标题 */
h3:before {
counter-increment: section;
content: counter(chapter) "." counter(section) " ";
}

虽然counters属性的语法可能有点困难，但它确实为大家提供了一种强大的工具，帮助大家创建更好的页面。通过掌握counters，大家可以轻松地创建复杂的编号方案，这在大型项目中非常有用。