Question

我正在使用CSS :after为一系列列表项添加分隔符，但我不想想要它:last-child和我对于我的生活，不记得上次我做这样的事情时我是如何工作的（这已经有一段时间了...抱歉）。

以下是我所拥有的：

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

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

Answer 1

您可以使用mydict = dict((k.strip(), v.strip()) for k, v in (item.split(':') for item in mystring.split(',')))覆盖它。

或者您可以将其添加到content: none;，而不是覆盖它。

Answer 2

只需使用:not(:last-child):after选择除最后一个孩子之外的所有元素。如此：

＆＃13;

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

＆＃13;

<ul>
  <li>Home</li>
  <li>About</li>
  <li>Contact</li>
  <li>Blog</li>
 </ul>

＆＃13;

Answer 3

你的css正在调用:last-child这样的元素：li:last-child

您需要执行类似

的操作

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

希望这有帮助。

从最后一个列表项中删除分隔符，但也使用after

3 个答案: