如何使用:CSS中不是选择器？

Question

我的问题说了一切.我是CSS新手.我试图使用以下代码,但它不起作用:

ul.verticalNav {
    /*declaration*/
}

ul.verticalNav li {
    /*declaration*/
}

ul.verticalNav li a {
    /*declaration*/
}

ul.verticalNav li a:not(:nth-last-child(1)) {
    border-bottom: 1px solid #323232;
}

该课程ul.verticalNav li a:not(:nth-last-child(1))没有创建边框.HTML是:

<ul class="verticalNav">
    <li><a href="#">Home</a></li>
    <li><a href="#">View Profile</a></li>
    <li><a href="#">Edit Profile</a></li>
    <li class="bottomLeftMenuItem"><a class="bottomLeftMenuItem" href="#">Search Profile</a></li>
</ul>

我无法找到问题所在.

提前致谢.

---

我使用的是Firefox 12.0和Google Chrome 18.0.1025.168 m.

Answer 1

你的选择器错了,它应该是

ul.verticalNav li:not(:nth-last-child(1)) a {
    border-bottom: 1px solid #323232;
}?

那是因为你的标记<a>总是会成为其<li>父母的最后一个孩子.你想要的是将风格应用于<a>任何<li>不是最后一个孩子的内部.