如何覆盖有序列表中一个特定li的编号

我建议 不 使用 ol ,或其他列表元素。

仅仅因为内容是编号的,并不意味着 奥尔 必须使用(也不一定适合使用)。在语义上,它可以表示为段落的编号序列。使用 奥尔

甚至 奥尔 在语义上是合适的:如果不能用 start 和 value (在你的例子中,似乎你做不到),内容只有与CSS结合才有意义。但是我们不应该依赖CSS来传达内容的含义。没有CSS支持的用户代理(或者应用覆盖相关部分的用户特定样式表的用户代理)将得到不同的编号。当引用这些列表项时,可能会导致误解,可能是关键的误解(尤其是在法律文件的情况下)。

所以我想这样说:

<section>
  <h2>6 High treason</h2>

  <p>(1) Any person who abrogates or subverts or suspends or holds in abeyance, or attempts or conspires to abrogate or subvert or suspend or hold in abeyance, the Constitution by use of force or show of force or by any other unconstitutional means shall be guilty of high treason.</p>
  <p>(2) Any person aiding or abetting or collaborating the acts mentioned in clause (1) shall likewise be guilty of high treason.</p>
  <p>(2A) An act of high treason mentioned in clause (1) or clause (2) shall not be validated by any court including the Supreme Court and a High Court.</p>
  <p>(3) Majlis-e-Shoora (Parliament) shall by law provide for the punishment of persons found guilty of high treason.</p>

</section>

这也允许你使用 a 对于可以链接特定子句的数字:

<section id="6">
  <h2>6 High treason</h2>

  <p id="6-1">
    <a href="#6-1">(1)</a>
    Any person who abrogates or subverts or suspends or holds in abeyance, or attempts or conspires to abrogate or subvert or suspend or hold in abeyance, the Constitution by use of force or show of force or by any other unconstitutional means shall be guilty of high treason.
  </p>

  <p id="6-2">
    <a href="#6-2">(2)</a>
    Any person aiding or abetting or collaborating the acts mentioned in clause <a href="#6-1">(1)</a> shall likewise be guilty of high treason.
  </p>

  <p id="6-2A">
    <a href="#6-2A">(2A)</a>
    An act of high treason mentioned in clause <a href="#6-1">(1)</a> or clause <a href="#6-2">(2)</a> shall not be validated by any court including the Supreme Court and a High Court.
  </p>

  <p id="6-3">
    <a href="#6-3">(3)</a>
    Majlis-e-Shoora (Parliament) shall by law provide for the punishment of persons found guilty of high treason.
  </p>

</section>

我使用CSS计数器来控制子句和子类的编号。有点笨重,但我不知道还有别的办法。

有三个不同的柜台(大的、克劳斯的和小的)。我是从6开始大的,因为这是你开始的数字,但是你可以把它改成你想要的。Claus和sub只是在它们期望的div类出现时重置并递增。

body {
	counter-reset: claus;
}
.bignumber {
	counter-reset: big 5;
}
.bignumber::before {
	counter-increment: big;
  content: counter(big) "\2014";
}
.clause {
	counter-reset: sub;
}
.clause::before {
	counter-increment: claus;
	content: "(" counter(claus) ") ";
}
.subclause::before {
	counter-increment: sub;
	content: "(" counter(claus) counter(sub, upper-alpha) ") ";
}

<article>
  <div class="bignumber"><em>High treason</em></div>
  <div class="clause">Any person who abrogates or subverts or suspends or holds in abeyance, or attempts or conspires to abrogate or subvert or suspend or hold in abeyance, the Constitution by use of force or show of force or by any other unconstitutional means shall be guilty of high treason.</div>
  <div class="clause">Any person aiding or abetting  or collaborating the acts mentioned in clause (1) shall likewise be guilty of high treason.</div>
  <div class="subclause">An act of high treason mentioned in clause (1) or clause (2) shall not be validated by any court including the Supreme Court and a High Court.</div>
  <div class="clause">Majlis-e-Shoora (Parliament) shall by law provide for the punishment of persons found guilty of high treason.</div>
  <div class="subclause">Here is a subclause that should be 3A.</div>
  <div class="subclause">Here is a subclause that should be 3B.</div>
  <div class="clause">And now on to 4 and beyond....</div>
</article>