css - CSS选择器：如何选择非元素兄弟节点？

Question

相邻兄弟选择器的语法如下：E1 + E2，其中 E2 是选择器的主题。如果 E1 和 E2 在文档树中共享相同的父级并且 E1 紧接在 E2 之前，则选择器匹配，忽略非元素节点（例如文本节点和注释）。

那么我们如何才能选择非元素兄弟节点。例如：在下面的html中，如何选择“非元素文本”文本？

<div><label>Some text here</label> Non-element text</div>

score 15 · Accepted Answer

你不能。CSS 选择器只能选择元素节点。这就是为什么相邻的兄弟组合器如所描述的那样工作的原因。

如果您需要应用样式，请尝试将它们应用到div并在label. 当然，这确实取决于您应用的样式，因为某些样式无法撤消或需要继承。

score 1 · Accepted Answer

如前所述，CSS 选择器只能选择元素节点。

要解决您的问题，您可以将文本节点包装在一个元素中，然后在该元素上应用样式，或者在容器元素上应用样式，然后在标签元素中覆盖它。

2 回答 2