CSS将前导零添加到有序列表自定义计数器

Question

我拥有的：

带有自定义计数器的有序列表：

ol {
  /*list-style-type:decimal-leading-zero;*/
  list-style: none;
  padding-left: 0px;
  counter-reset: item;
}

ol>li {
  display: table;
  counter-increment: item;
}

ol>li:before {
  display: table-cell;
  padding: 0 0.5em 0 0;
  content: counter(item) ".";
  font-weight: bold;
}

<ol>
  <li>List item one.</li>
  <li>List item two.</li>
  <li>List item three.</li>
  <li>List item four.</li>
  <li>List item five.</li>
  <li>List item six.</li>
  <li>List item seven.</li>
  <li>List item eight.</li>
  <li>List item nine.</li>
  <li>List item ten.</li>
</ol>

我需要什么：

任何编号小于10的列表项之前的前导零。

即。 01,02,03,04,05,06,07,08,09,10。

我的问题：

如何通过CSS实现所需的前导零？

Answer 1

来自：Sven Wolfermann通过CodePen

您可以通过将.collection-nav-desc-wrapper .collection-desc p { color: #e1483d; font-family: Georgia, serif; font-size: 36px; font-weight: normal; font-style: italic; letter-spacing: 0px; line-height: 1.2em; font-family: adobe-garamond-pro; <------- This one is taking precedence over the Georgia Family font-size: 120px; font-weight: 600; font-style: normal; letter-spacing: -.01em; line-height: 1.3em; text-transform: none; text-decoration: none; 添加到decimal-leading-zero

来添加前导零

li:before{ content: counter(...); }