CSS

使用方法

  • 可以使用以下属性来操作CSS计数器:
    • counter-reset: 用于定义和初始化一个新的计数器。
    • counter-increment: 用于增加计数器的值。
    • content: 用于在元素中显示计数器的值。
  • 可以通过设置不同的选择器和属性来控制不同元素的计数器行为。

适用范围

作用

  • CSS计数器可以用于创建有序列表、标记不同章节或段落等场景。

示例

<!DOCTYPE html>
<html>
<head>
<style>
/*定义计数器*/
body {
  counter-reset: section;
}
h2::before {
  counter-increment: section;
  content: "Section " counter(section) ": ";
}
</style>
</head>
<body>
 
<h2>Introduction</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 
<h2>Benefits</h2>
<p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
 
</body>
</html>

father:: CSS