1

在我的 CSS 中有以下代码来实现嵌套列表的堆叠编号（即 1、1.1、1.2 等）

ol { counter-reset: item }
ol li { display: block }
ol li:before { content: counters(item, ".") ". "; counter-increment: item }

但是，当我在编号列表中嵌入了项目符号列表时，我发现这会干扰列表类型。

  <ol class="numberList">
    <li>
      List 9 – Multi-level mixed bullets &amp; numbers (Custom)
      <ul class="bulletList">
        <li>
          SHOULD BE A BULLET List 9 – Multi-level mixed bullets &amp; numbers (Custom)
          <ol class="numberList">
            <li>
              List 9 -- Multi-level mixed bullets &amp; numbers (Custom)
            </li>
            <li>
              List 9 -- Multi-level mixed bullets &amp; numbers (Custom)
            </li>
          </ol>
        </li>
      </ul>
    </li>
  </ol>

我应该在第一个嵌套列表中得到一个项目符号，但是，我得到一个数字“2”。

如何让项目符号列表与我的嵌套列表编号一致？谢谢！

4

1 回答 1

3

选择器ol li表示任何 li属于. _ ol所以如果你有，<ol><li><ul><li>那么后者li也将被匹配。

要改变这一点，你可以使用子组合器，它只匹配下面的层：

ol > li { ... }
ol > li:before { ... }
于 2013-09-20T14:29:24.633 回答