如何更改ol列表的列表顺序？

Question

使用Css，而不是html属性“反向”。 我可以像这样实现它：

<ol reversed>
    <li>test</i>
    <li>test2</li>
</ol>

但我想通过CSS

来做

Answer 1

CSS反转

ol.reverse {
        list-style: none;
        counter-reset: reverse 11;
      }

      ol.reverse > li:before {
        content: counter(reverse) '.';
        display: block;
        left: -30px;
        position: absolute;
        text-align: right;
        width: 20px;
      }

      ol.reverse li {
        counter-increment: reverse -1;
        position: relative;
      }

您的代码应为

 <ol class="reverse">
        <li>test</i>
        <li>test2</li>
    </ol>

Answer 2

试试这个：

<ol style="counter-reset: list-items 3;">
<li>test</i>
<li>test2</li>
</ol>


<style>
ol{
   list-style-type: none;
   list-style-position: inside;
 }
li:before{
   content: counter(list-items) '. ';
   counter-increment: list-items -1;
}
</style>