怎样用 CSS 消除连续的 br 标签？

Question

怎样用 CSS 消除连续的 br 标签？

假定需要需要处理的 HTML 如下

<p>
    1st line.
    <br>
    2nd line.
    <br> <br>
    3rd line.
    <br> <br>
</p>

• 需求：将 2nd line. 与 3rd line. 后的两组两个 <br> 标签各去除一个。
• 概括：将连续一个以上的 <br> 标签中， 除第一个外全部设为 display: none;
• 困难：由于 <br> 标签间隔于文本节点之中，因而不能用简单的 br + br 来选中需去除的节点，否则除 1st line. 后的 <br> 标签，其它的都会失效。

• 补充：出于某些原因，不期望使用（如没有更好方法可能会选取）如下方法解决：

  1. 将 <br> 标签分离出去。
  2. 不使用 <br> 标签，而用其它形式取代。
  3. 用某种方式给文本节点套上一层 <span> 等元素。

求大神解决！qwq

Answer 1

没有办法，CSS 是声明式语言，且忽略文本节点，你不改 DOM 结构无法做到。

Answer 2

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

不知道这个能不能满足你，n是你想隐藏的第几个br标签

Answer 3

br + br {
    display: none;
}