使用 CSS，如何获取元素 B 上的伪类'empty'来影响元素 A 的样式？

Question

我有两个非常简单的文本字段，我想根据第二个'空'pseudo-class造型第一个元素。我该怎么做？

<style type='text/css'>
#element-b:empty [MAKE ELEMENT-A BOLD]{
}
</style>   
<div id="element-a">Some Element</div>
<div id="element-b">Some Other Element</div>

Answer 1

只需使用相邻的兄弟姐妹选择器+

#element-a:empty + #element-b {font-weight:bold;}

+选择器将选择位于选定元素之后放置的元素。

更新问题后的更新：不可能选择上一个元素。使用CSS，您只能通过+兄弟姐妹选择器选择下一个元素，但是选择上一个是不可能的。

Answer 2

如果您扭转了代码中元素的位置，则可以在CSS中执行此操作，例如：

<style type='text/css'>
#element-b:empty + #element-a {
}
</style>   
<div id="element-b">Some Other Element</div>
<div id="element-a">Some Element</div>

现在，显然您的元素已经不正确，但是您可以简单地将它们重新排列。

小提琴在这里。从元素b中删除文本以查看元素粗体。