Question

代码：

<ul class="linkedd">
    <li><a href='#home'>Home</a></li>

    <li><a href='#about'>About</li>

    <li><a href='#portfolio'>Portfolio</li>

    <li><a href='#contact'>Contact</li>      
</ul>             

li:nth-child(n+2):before{
    content: " - ";
}

我之前已经查找过这个解决方案来添加StackOverflow中的破折号分隔符...但是，对于我来说，一个用户建议不起作用的是

li + li:before {
    content: "/";
}

我理解nth-child是如何工作的，并且它从0位置开始向上，所以在＃34; home＆＃34;前面没有冲刺。然而，我不明白为什么li + li:before只给了我一个冲刺（在家和大约之间），而不是其余的。

有人可以向我解释一下吗？

Answer 1

因为您未在第二个a和li之后关闭li标记

＆＃13;

li + li:before {
  content: "/";
}
/*demo */

li {
  float: left;
  list-style:none
}

＆＃13;

<ul class="linkedd">
  <li><a href='#home'>Home</a>
  </li>
  <li><a href='#about'>About</a>
  </li>
  <li><a href='#portfolio'>Portfolio</a>
  </li>
  <li><a href='#contact'>Contact</a>
  </li>
</ul>

＆＃13;

text-separator与第n个子节点一起使用，但对于无序列表下的列表项不具有li + li

1 个答案: