html - CSS 选择器 : finding the last sibling of a type

Question

我有一个看起来像这样的文档:

<h1>Title A</h1>
<h2>Sub 1</h2>
<h1 class='foo'>Title B</h1>
<h2>Sub 2</h2>
<h2>Sub 3</h2>
<h1>C</h1>
<h2>Sub 4</h2>

我想选择 Sub 2 和 3，因为它们在 Title B 之后，是类 foo 的 h1。但是，我对 Sub 4 不感兴趣，因为前面的 h1 属于 foo 类。

我知道我可以在每个以 h1 开头的 block 周围放置 div，但我的内容是通过 markdown 生成的，所以唯一的方法是在页面加载后更改 DOM，这感觉又脏又麻烦。

我的问题与这个有点相关How to select all elements after specific element in CSS但是一旦看到常规的 h1，我就缺乏“恢复正常”的行为。

Answer 1

http://jsfiddle.net/70zxd3h8/

.foo + h2, .foo + h2 + h2 {
    background:red;
}

或者h2:nth-of-type(2), h2:nth-of-type(3)