一尘不染

如何在HTML中显示逆序列表?

html

我需要帮助。有什么办法可以在css / scss中显示逆序列表?类似于以下内容:

  5. I am a list item.
  4. I am a list item.
  3. I am a list item.
  2. I am a list item.
  1. I am a list item.

阅读 931

收藏
2020-05-10

共1个答案

一尘不染

您可以旋转父元素180deg,然后旋转子元素-180deg

ul {
    transform: rotate(180deg);
}
ul > li {
    transform: rotate(-180deg);
}

或者,您可以将flex框与 属性一起使用 order


尽管从技术上讲这并不是颠倒顺序,但您也可以将其counter-increment 与伪元素一起使用。

ul {
    list-style-type:none;
    counter-reset:item 6;
}
ul > li {
    counter-increment:item -1;
}
ul > li:after {
    content: counter(item);
}
2020-05-10