CSS唯一子级，如果其他子级被隐藏

如果元素不是唯一可见的子元素，是否有任何方法（仅使用CSS）向元素添加填充

到目前为止，我使用了：NOT和：only-child选择器：

div span:not(:only-child) {
    padding-right:5px;
}

然而，不幸的是，如果存在另一个子项，但它是隐藏的，那么它将被视为不是唯一的子项，并且会应用填充

此处演示：

希望这是有道理的

---

感谢

没有CSS选择器来区分可见元素和隐藏元素或不明显元素

由于您的演示使用jQuery，因此有一个

：visible

选择器，它：

---

如果您不能使用jQuery，或者您的实际标记要复杂得多，那么您必须找到另一种方法，通过修改标记或使用脚本来确定何时应用该填充。仅使用CSS无法解决您的问题。

我认为

display:none

并不意味着它从父项中删除，因此事实上父项在这两种情况下都有两个子项。您可以使用脚本来完成此操作，但纯CSS无法完成。您的第一个

span

无论如何都不是这两种情况下的唯一子项，因为存在

br

；但是，它是

：仅属于您预期的
：独生子女
类型。当然只是吹毛求疵，但它解释了为什么我在我的答案中使用了第n个孩子（2）
，而不是你所期望的第一个孩子（我甚至会使用第一个类型的孩子）。谢谢大家，这就是我的想法。找到了另一个更简单的解决方案-希望我早点看到它…哦！
$("div span:nth-child(2):not(:has(+ span:visible))").css("padding-right", "5px");