css - 如何在不重置计数器的情况下在列表中使用 CSS 计数器?

标签 css

我想要多个“ol”列表,其中计数器值在列表之间重置。另一种说法是,我希望第二个列表中第一个“li”的计数器比前一个列表最后一个元素的计数器值高一个。是否有一些 CSS 魔术可以做到这一点?

最佳答案

同时 Su's answer会起作用的,你不需要那么笨手笨脚。只需重置顶部的计数器,无论你在哪里使用它,它都会递增。

body {
  counter-reset: item;
}

li {
  display: block;
}

li:before {
  display: inline-block;
  content: counter(item) ". ";
  counter-increment: item;
}

看这个example

关于css - 如何在不重置计数器的情况下在列表中使用 CSS 计数器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14469689/

相关文章:

html - li 内的右对齐 div 应填充高度

css - 为什么无法从 Rails 中的 View 加载管道内的图像?

html - Rshiny - 将 slider 与文本输入相结合,使 slider 更加人性化

css - 在移动设备上折叠 3 列

jquery - Div 元素不会在 JQuery 中重新定位

javascript - 在将事件类添加到 <a> 时隐藏侧导航栏的 <hr> 元素

php - 在 php mysql while 循环上运行 jquery 函数

css - 语义 ui-react 固定侧边栏和导航栏 : can't get sidebar and content to scroll nicely

html - 为什么 CSS[margin-right] 没有在 html 中应用?

jQuery Full calendar - 在月 View 中将固定高度设置为日期