带有类选择器的CSS last-child

Question

http://jsfiddle.net/SJyV3/

HTML：

<div id="parent">
    <div class="tt">tt</div>
    <div class="tt">tt</div>
    <div class="huh">huh</div>
</div>

CSS：

.tt:nth-child(2) {
    color:blue;
}
#parent .tt:last-child {
    color:red;
}

是否可以选择提供类的最后一个子元素？

Answer 1

 div.tt:last-child {
    background:yellow;
}

实际选择最后一个孩子。但是，如果它不是其父级中的最后一个实例，则它不会选择该类的最后一个实例。

因此您必须将HTML更改为：

<div id="parent">
    <div id="ttwrppaer">
        <div class="tt">tt</div>
        <div class="tt">tt</div>
        <div class="tt">tt</div>
    </div>
    <div class="hhhd">tt</div>
</div>

这是demo

Answer 2

我认为，您正在尝试在父元素（#parent）div元素中选择last-child div。所以你需要选择它。

试试这个： 的 HTML：

<div id="parent">
    <div class="tt">tt</div>
    <div class="tt">tt</div>
    <div class="huh">huh</div>
</div>

CSS：

.tt:nth-child(2) {
    color:blue;
}
div div:last-of-type {
    color:red;
}

Try this 1

OR

.tt:nth-child(2) {
    color:blue;
}
div div:last-child {
    color:red;
}

Try this 2