根据字符串大小填充？

* {\n  margin: 0;\n  padding: 0;\n  font-family: Arial;\n}\n\nol {\n  counter-reset: item;\n}\n\nli {\n  display: block;\n}\n\nli:before {\n  content: counters(item, ".") "\xe2\x80\x83";\n  counter-increment: item;\n}\n\nol li ol li {\n  margin-left: 80px; /* The left margin should have exactly the width of one number and a &emsp; */\n}

Run Code Online (Sandbox Code Playgroud)\r\n

<ol>\n  <li>Coffee\n    <ol>\n      <li>One</li>\n      <li>Two</li>\n      <li>Three</li>\n    </ol>\n  </li>\n  <li>Tea\n    <ol>\n      <li>One</li>\n      <li>Two</li>\n      <li>Three</li>\n    </ol>\n  </li>\n  <li>Milk</li>\n  <li>Cool</li>\n</ol>

Run Code Online (Sandbox Code Playgroud)\r\n

\r\n

目前ol li ol li有margin-left: 80px;. 现在可以手动调整该px …

css

Ann*_*a_B

lucky-day

5
推荐指数

1
解决办法

78
查看次数

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

我拥有的：

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

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;
}

Run Code Online (Sandbox Code Playgroud)

<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>

Run Code Online (Sandbox Code Playgroud)

我需要的：

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

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

我的问题：

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

html css html-lists css-counter

Cla*_*nus

lucky-day

4
推荐指数

1
解决办法

4080
查看次数

CSS decimal-leading-zero不适用于大数字

最近我遇到了一个问题,我创建了一个包含超过百个列表项的有序列表.我已经设定list-style: decimal-leading-zero;

ol{
  list-style: decimal-leading-zero;
}

Run Code Online (Sandbox Code Playgroud)

<ol>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
</ol>
<p>...</p>
<ol start="96">
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
<li>Some item</li>
</ol>

Run Code Online (Sandbox Code Playgroud)

问题:只有前九个列表项的前导零.

提取:前九个列表项中的两个前导零和第10个到第99个列表项的一个前导零.

html css html5 css3

Kir*_*kya

lucky-day

3
推荐指数

1
解决办法

767
查看次数