选择相邻兄弟

Question

的孩子的标记，如：

<span class="location-title-container"> 
</span> 

<div class="content-panel"> 
    <div class="floor-left-panel"></div> 
    <div class="floor-right-panel"></div> 
</div> 

如何选择.floor-left-panel上空盘旋.location-title-container什么时候？

Answer 1

你必须使用相邻的选择器来获取它后面的元素。 你的选择应该是这样的：

.location-title-container:hover + .content-panel .floor-left-panel { … } 

只是为了您的信息，你不应该在span标签使用:hover。 默认情况下它们不可访问。您应该添加一些WAI ARIA角色标签。

Answer 2

.location-title-container:hover + .content-panel .floor-left-panel {}是您需要的选择器。

加号用于选择DOM中的下一个相邻元素。