css - 如果有内部 div，则未正确设置最后一个子选择器

Question

我在http://jsfiddle.net/ahvru/创建了我的问题的简化版本

我希望班级中的最后item class一个parent是不同的颜色。相反，它将设置item每个内部的最后一个类div，而不是实际的parent class。

item4无论我有多少内部 div ，预期的结果应该是唯一的蓝色 div

谢谢

Answer 1

这是正确的行为，阅读文档

你必须做这样的事情

.parent .inner2 .item:last-child{
    background-color:blue;
}

但这可能不是您想要的解决方案。

除了通过 JavaScript 添加一些类或更改您的 html 结构以正确使用 :last-child 之外，我没有其他方法

Answer 2

你在找这个吗？

.parent div:last-child .item:last-child{
    background-color:blue;
}

Answer 3

如果您使用的是 css3，则可以尝试在 css 选择器中使用“last-of-type”。

http://www.w3schools.com/cssref/sel_last-of-type.asp

Answer 4

如果不实际计算.item孩子的数量，.parent恐怕你会倒霉的。但是，特别是对于这种情况，碰巧这是可行的：

.parent .item:not(:first-child) {
    background-color:red;
}
.item:last-of-type {
    height:30px;
    background-color:blue;
}