带有节号的自定义 <ol> 编号

Question

我在大纲中有几个项目，每个项目都有类似格式的节号。

例如：

1.3.1
2.1.1
3.4.5

有没有办法让我的有序列表将“1.1.1”（和“2.1.1”等）识别为起点？

因此发布列表将如下所示：

1.1.1 mumbo jumbo
1.1.2 blah blah
1.1.3 something something

使用类似这样的东西作为 HTML：

<ol start="1.1.1">
  <li>mumbo jumbo
  <li>blah blah
  <li>something something
</ol>

这在原生 HTML/CSS 中可行吗？显然上面的 HTML 不起作用（迭代器恢复为 1、2、3）。

Answer 1

看到这个fiddle

你可以使用 CSS counter 属性

HTML

<ol class="custom">
    <li>mumbo jumbo</li>
    <li>blah blah</li>
    <li>something something</li>
</ol>

CSS

.custom {
    counter-reset: custom;
}
.custom li {
    list-style-type: none;
}
.custom li::before {
    counter-increment: custom;
    content:"1.1." counter(custom)" ";
}

在 docs

中阅读有关 counter 的更多信息

和here是来自W3Schools的counter的例子。