如果其他孩子被隐藏，那么只能使用CSS子元素

如果元素不是唯一的可见子元素，是否有任何方法（仅使用CSS）向元素添加填充内容？如果其他孩子被隐藏，那么只能使用CSS子元素

到目前为止，我有它使用：NOT和：独生子女选择：

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

然而不幸的是，如果一个孩子存在，但它隐藏在它被认为不是独生子女和填充得到应用。

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

希望是有道理的。

由于

来源

2014-04-16 Martin

我认为'display：none'并不意味着它已从父母中移除，所以实际上父母在这两种情况下总是有两个孩子。 –

你可以用脚本来做到这一点纯CSS不会做到这一点。 – ProllyGeek

无论如何，你的第一个'span'不是唯一的孩子，因为有'br';但它是'：only-of-type'，你可以期望它是'：only-child'。当然，只是挑剔，但它解释了为什么我在我的答案中使用'：nth-child（2）'，否则你会预期'：first-child'（我甚至会使用'：first-of-type'除了[使用的jQuery版本不支持它]（http://stackoverflow.com/questions/11745274/what-css3-selectors-does-jquery-really-support-eg-nth-last-child））。 – BoltClock

有用于从隐藏或以其他方式不表观元件区分可见的元素没有CSS选择。

由于您的演示使用jQuery的，还有就是:visible选择其中makes it easy enough：

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

如果您不能使用jQuery或实际标记要复杂得多，你将不得不另谋出路，要么通过修改标记或使用脚本来确定何时应用该填充。您的情况不能使用CSS解决。

来源

2014-04-16 14:34:00 BoltClock

如果其他孩子被隐藏，那么只能使用CSS子元素

回答

相关问题