在下面的代码中，我将如何使用CSS定位第二个div.b？
<div> <div class="a"></div> <div class="a"></div> <div class="a"></div> <div class="b"></div> <div class="b"></div> <div class="a"></div> </div>
解决方法
在这个特殊情况下，你可以使用
adjacent sibling combinator,
+。
.b + .b {
color:red;
}
上面假设有不超过两个，相邻的.b元素。如果不是这样，general sibling combinator,~,将更有用，假设仍然只有两个.b元素。
.b ~ .b {
color:red;
}
作为替代，您也可以使用以下，它将使用多个.b元素，无论位置。最初，使用.b〜.b设置第二个目标元素的样式。然后，您需要使用.b〜.b〜.b来重置第二个.b元素后的.b元素的样式。
.b ~ .b {
color:red;
}
.b ~ .b ~ .b {
color:initial;
}
这在理论上应该在所有情况下工作，例如：
<div class="a">1a</div> <div class="a">2a</div> <div class="a">3a</div> <div class="b">1b</div> <div class="a">4a</div> <div class="b">2b</div> <!-- This would be styled red.. --> <div class="b">3b</div>
还值得注意的是IE中不支持值initial。因此，您可以使用颜色：#000至reset the color back to the defaults.或者，继承would work too。
作为一个更实际的例子，你可以使用这样的：
.b ~ .b {
width:200px;
background:blue;
color:#fff;
}
.b ~ .b ~ .b {
width:auto;
background:transparent;
color:#000;
}
