仅在第一次或最后一次出现类时才应用CSS

Question

我有一个HTML table，其中有很多行

 ________________________
|_1______________________|
|_2______________________|
|_3______________________|
|_4______________________|
|_5______________________|

这些行是可扩展的，用户可能会扩展其中的多个行

 ________________________
|_1______________________|
| 2                      |
| border-top             |
| border-bottom          |
|________________________|
|_3______________________|
| 4 ...                  |

我需要用border-top和border-bottom突出显示展开的行。

但是，如果将相邻的两行扩展，则上一行的border-bottom与下一行的border-top会合并。
边界为1px的结果为1px + 1px，这是我不希望的。

使用CSS选择器可以避免这种情况吗？

Answer 1

如果我理解得很清楚：如果打开了2个相邻行，那么第二行应该隐藏其顶部边框以避免出现双边框？

您可以使用同级运算符+执行此操作。

.row-expanded + .row-expanded {
  border-top: none;
}