css - 是否可以组合 css3 伪类 :after and :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