我的HTML中的一些子项具有hidden
属性,这使得它们从显示中消失(通过应用*[hidden] { display: none; }
等CSS。)
然而,有时其他CSS不能很好地使用它,因为它不会忽略这些隐藏的项目。例如,假设我想通过将margin-bottom
应用于除最后一项之外的所有项目,在垂直堆叠的项目之间添加边距。一个可能有这样的东西(如在this question中):
:not(:last-child) { margin-bottom: 5px; }
不幸的是,当隐藏最后一个孩子时,这将会出错,因为该样式将应用于隐藏的最后一个孩子,而不是最后一个非隐藏孩子。
是否可以通过使用所有非隐藏孩子的集合而不是所有孩子来使像这样的选择器工作?
注意,这个问题是关于在子集的子集上应用CSS伪类(例如last-child
)的一般问题,填充问题只是一个可以通过其他方式解决的示例,请避免讨论关于那个具体问题。