html - 使用 CSS 删除多个额外的中断标签

Question

我有这个带有多个<br>标签的 HTML。

<br>
<br>
<br>
<br>
<br>
TITLE
<br>
<br>
foo bar
<br>
foo bar
...

我想最多只保留单次和双次中断（新行和新段落），我想忽略所有额外的<br>. 所以最多有2个<br>一个接一个。所以，

<br><br><br><br><br>TITLE<br><br>foo bar<br>foo bar<br><br><br>foo bar

会成为

<br><br>TITLE<br><br>foo bar<br>foo bar<br><br>foo bar

我怎样才能用 CSS 做到这一点？

我想选择所有<br>至少有 2 个前<br>兄弟姐妹的元素

编辑：对于更多的上下文，HTML 在外部网站上，我尝试使用 firefox/stylish 改进阅读，所以只使用 CSS

Answer 1

通过使用:nth-child选择器，您可以轻松实现它。

CSS：

br:nth-child(3n + 3) { display: none; }​

看演示

Answer 2

虽然在大多数浏览器中<br>标签不能以任何其他方式设置样式，但您可以隐藏它们：

br+br+br {display: none}​ /* (Also works in IEs 7+8) */

http://jsfiddle.net/nottrobin/Wxf3D/1/（感谢@AK）

这样做的问题是，使用标记<br><br><br>hello<br>它也将匹配最终的<br>，因为它不将文本节点视为兄弟节点。您可以通过将标记更新为：

<br><br><br><br><br>
<p>TITLE</p>
<br><br>
<p>foo bar</p>
<br>
<p>foo bar</p>

当然，如果您愿意，您也可以使用 jQuery 删除这些元素：

<script>
    jQuery("br+br+br").remove();
</script>

（恐怕我对尝试制定仅 JavaScript 的解决方案失去了耐心）