html - 纯 CSS：选择具有 n 个或更多兄弟元素的元素

Question

我想在有多个兄弟的基础上选择一些元素，例如：

• 在表格中，当有超过给定数量的行（例如，有等于或多于 3 个同级<tr>元素）时，我想选择所有行（不是表格）
• 具有超过给定数量的项目的列表（例如，有等于或多于 3 个同级<li>元素） 我想选择所有项目（不是列表）

我知道有:not(:only-child)（见https://stackoverflow.com/a/34624032/79485）但我想要类似的东西

tr:min-siblings(3) {
    color: blue;
}

我可以使用兄弟姐妹的数量作为所有这些兄弟姐妹的选择器吗？

注意：这次我正在寻找仅 CSS 的解决方案。

标签： htmlcsscss-selectors

Answer 1

尝试这样的事情：

tr::nth-child(1n+4){
 // your awesome styles
}

这是一个带有工作示例的代码笔

这告诉选择器找到每个第一个孩子（不跳过任何内容） - 并从偏移 4 开始 - 这使您处于第三个元素:-)