css最后一个孩子不工作

Question

我有一个新闻文章的网格，我想它，所以网格中的最后两篇文章没有底部边框，但是我的css last-child选择器似乎没有工作，最后一篇文章与阶级权利有边界被取消，但是最后一篇文章没有留下，这是否有原因？

这是我的代码和问题的小提琴。

http://jsfiddle.net/Udders/HJE5h/

Answer 1

如上面的@BoltClock所述，交换broder-bottom border-top并转而定位first-child。旧版浏览器不支持last-child：

JSFiddle：http://jsfiddle.net/HJE5h/2/

修改

好的，正如@BoltClock在下面的评论中提到的那样，问题并不完全在于last-child问题。但是，如果您按照上面的建议使用border-top，然后定位紧跟select后面的下一个first-child元素，则可以从前两篇文章中删除border-top。< / p>

section:first-child .snippet, section:first-child + section .snippet {
    background:none;
    border-top:none;
}

JSFiddle：http://jsfiddle.net/HJE5h/5/

Answer 2

您可以使用nth-last-child（n）伪类来实现。它从集合的末尾开始，这样您就可以在不知道集合大小的情况下指定最后两个元素。请在您的css代码中尝试此选择器：

.grid_9:nth-last-child(1) .snippet, .grid_9:nth-last-child(2) .snippet {
    background: none;
    border-bottom: none;
}

这是有用的css选择器http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/

的一个很好的参考