html - 目标是 ul 中的第二个 child

Question

我需要在我的 UL 中瞄准第二个 child 。这是我应用的 html 代码和样式

HTML:

<ul class="latestpost">
    <li class="clearfix">
        <time datetime="2014-10-22T19:33">22<span class="month">Oct</span></time>
        <h4><a href="#" rel="bookmark" title="Title</a></h4>
        <div class="excerpt">
            sometxt...
        </div>
    </li>

    /*I want to target bg of this li below, it is also li of the same ul as first li in my html */
    <li class="clearfix">
        <time datetime="2014-10-22T09:16">22<span class="month">Oct</span></time>
        <h4><a href="#" rel="bookmark" title="Permanent Link to title</a></h4>
        <div class="excerpt">
            sometxt...
        </div>
    </li>
</ul>

CSS:

.latestpost li time {
        background:#d5176f;     
        border-right: 1px solid #d5176f;
        border-bottom: 1px solid #d5176f;
        color:#fff;
}
ul.latestpost li time:nth-child(2) {
        background:red !important;      
        border-right: 1px solid #d5176f;
        border-bottom: 1px solid #d5176f;
        color:#fff !important;
}

现在挣扎了一段时间，但我知道这是一个简单的修复。欢迎任何建议

谢谢!!!

Answer 1

不是第二个<time>元素，但第二个 <li> 您定位的元素。所以，使用这些规则:

.latestpost li time {
    ...
}
.latestpost li:nth-child(2) time {
    ...
}

旁注:请修复这些损坏的标签