css last-child 匹配所有 child

Question

我试图通过在每个链接的右侧创建一个边框来在我的链接之间创建一个分隔符。然后在最后一个，删除它。我有以下 html 和 css，但我发现每个“a”标签都与最后一个子选择器相匹配。我不清楚为什么以及这样做的正确方法是什么。

<ul class="nav">
  <li><a href="#">link1</a></li>
  <li><a href="#">link2</a></li>
  <li><a href="#">link3</a></li>
  <li><a href="#">link4</a></li>
</ul>


.nav a { border-right:solid 1px #000;}
.nav a:last-child { border-right-width:0px;}

Answer 1

那是因为每个 a是其父级 li 的最后一个子级.你会想要类似 .nav li:last-child a 的东西反而。