关于`counter-reset`无法多次重置的问题
- Dominant language
- JavaScript
- Stars
- 3.3k
- Forks
- 233
- Avg merge
- 1d 10h
- Merged PRs (30d)
- 8
Description
我在使用时发现虽然可以实现计数器的自动增长,`counter-reset`仅仅能在根元素生效一次,如果我想实现遇到`h1`就`reset``h2`的计数器,多次reset就无法正常工作了
正常在浏览器显示是这样的

使用`juice`之后变成这样了

这还是我将代码中增加的判断给去掉了的情况下,否则将无法识别h2的计数器

以下是相关的`css`,我的代码`h1`可以正常增长,但`h2`不行,即使修改代码了也只能实现自动增长,无法和h1进行联动。
```
#nice p {
text-indent: 2em;
}
/* 一级标题 */
#nice h1 {
line-height: 28px;
border-bottom: 1px solid rgb(37,132,181);
counter-reset: counterh2;
}
#nice h1:before {
background: rgb(37,132,181);
color: white;
counter-increment: counterh1;
content: 'Part'counter(counterh1);
padding: 2px 8px;
}
#nice h2:before {
counter-increment: counterh2;
content: counter(counterh1)"."counter(counterh2);
color:rgb(37,132,181);
border-bottom: 4px solid rgb(37,132,181);
font-size: 18px;
padding: 2px 4px;
}
```
`html`代码如下:
```
测试h1
测试h2
测试h2
测试测试h1
测试h2h2
测试h2h2
```
Contributor guide
Research direction
No source file or test is named. Start by reproducing the supplied CSS and HTML in Juice, then compare the browser result with the inlined output. Done means repeated counter-reset behavior is preserved so h1 and h2 numbering remains linked across multiple headings.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, html, javascript
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100