是否可以组合css3伪类：after和：lastchild？

Question

我有一个链接列表，我使用以下代码在每个链接项后面添加一个单词：

a:after {content: "eg"}

但是，我不希望内容出现在列表中的最后一项之后，所以理想情况下我想说的是

a:last-child:after {content: ""}

但这是剥离所有链接后的内容。是否还有将这两者结合起来的方法？如果有，你可以解释究竟发生了什么，我真的很感激它：）

谢谢

Answer 1

试试这个：

HTML：

<ul>
<li><a href="#">Check this out</a></li>
<li><a href="#">Check this out</a></li>
<li><a href="#">Check this out</a></li>
</ul>

CSS：

a:after {content: "what what"}
li:last-child > a:after {content: ""}​

这是一个Fiddle来演示。

另外，请记住，如果您有许多使用IE7和IE8的用户，:after伪类在IE7及以下版本中不起作用，并且:last-child伪类在IE8中不起作用以下。见这里：http://www.quirksmode.org/css/contents.html

Answer 2

我会使用:not，:last-child和:after的组合来实现这一目标。使用:not(:last-child)，您可以选择除最后一个链接之外的所有链接： http://jsfiddle.net/2CS9G/

a:not(:last-child):after{
    content: "--";
}

如果您的a - 代码位于列表中（ul）： http://jsfiddle.net/2CS9G/2/

li:not(:last-child) a:after{
    content: "--";
}

Answer 3

以下选择器组合对我有用：

#myObj ul li:last-child::after { . . . }

Answer 4

它对我有用＆gt; link

您可能忘记将display: block添加到a。

Answer 5

“Delphi”的评论有帮助吗？ （https://stackoverflow.com/a/4917325/960592

  

使用带有selectivizr的nick craver解决方案允许交叉   浏览器解决方案（IE6 +）