CSS only-child 如果其他 child 被隐藏

Question

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

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

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

但是不幸的是，如果存在另一个 child 但它是隐藏的，则它被认为不是唯一的 child 并且会应用填充。

演示在这里: http://jsfiddle.net/3Qr7v/

希望这是有道理的。

谢谢

Answer 1

没有用于区分可见元素与隐藏元素或不明显元素的 CSS 选择器。

由于您的演示使用 jQuery，所以有 :visible 选择器 makes it easy enough :

$("div span:nth-child(2):not(:has(+ span:visible))").css("padding-right", "5px");

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