html - 从最后一个列表项中删除分隔符，但也删除分隔符

Question

我正在使用 CSS :after 向一系列列表项添加分隔符，但我不希望它在 :last-child 上 我这辈子都记不起上次我是如何让它工作的(已经有一段时间了……抱歉)。

这是我所拥有的:

li {
  display: inline-block;
  list-style: none;
  &:after {
    content: '|';
    margin: 0 5px;
  }
  &:last-child {
    content: '';
  }
}

希望这有意义？我不记得我是否需要以不同的方式构建它还是什么。

Answer 1

您可以使用 content: none; 来覆盖它。

或者您可以将它添加到 &:not(:last-child):after 而不是覆盖它。