Сбросить вложенную нумерацию в старом - PullRequest
0 голосов
/ 16 февраля 2019

Я использую следующую CSS для генерации вложенной нумерации в ol:

ol{
    counter-reset: item;
}
ol li{
    display: block;
}
ol li:before{
    content: counters(item, ".")". ";
    counter-increment: item;
    float: left;
    margin-right: 5px;
}

На некотором уровне вложенности я хочу сбросить вложенность.Как мне этого добиться?

Например,

<ol>
    <li>
        <ol>
            <li>
                <ol>
                    <li>
                        <ol class="reset">
                            <li>
                                <ol>
                                    <li></li>
                                </ol>
                            </li>
                        </ol>
                    </li>
                </ol>
            </li>
        </ol>
    </li>
</ol>

Дает следующее:

1.
  1.1
     1.1.1
        1.1.1.1
           1.1.1.1.1

Но мне нужна такая структура

1.
  1.1
     1.1.1
        1 # reset here
          1.1

1 Ответ

0 голосов
/ 17 февраля 2019

Вы можете сбросить счетчики и начать все заново в дополнительном пункте.

ol li {
  counter-reset: item;
  display: block;
}

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

.reset li {
  counter-reset: reset_item;
}

.reset li::before {
  content: counters(reset_item, ".")". ";
  counter-increment: reset_item;
}
<ol>
  <li>
    <ol>
      <li>
        <ol>
          <li>
            <ol class="reset">
              <li>
                <ol>
                  <li></li>
                </ol>
              </li>
            </ol>
          </li>
        </ol>
      </li>
    </ol>
  </li>
</ol>
...