Question

基本上，我想做的是每当我将鼠标悬停在span元素上时，显示“ Look at me glow”消息。这是内部样式表。

<style>

p span:hover {
  background-color: lightblue;
}

#hover {
  position: absolute;
  display: none;
  top: 38px;
  left: 100px;
  background-color: aqua;
  border: 10px solid aqua;
  border-radius: 6px;
}

div #SPAN:hover #hover{
  display: block;
}


</style>

HTML

<body>
<div><p>I don't have a <span id="SPAN">light blue</span> background because I'm not a direct child</p> 

<p id='hover'>Look at me glow</p></div>

</body>

然后我调整了选择器路径，发现如果删除#SPAN，它可以工作。

div:hover #hover{
display: block; } /* Displays hover message when mouse goes across the whole string - not the expected outcome */

尽管我希望在将鼠标专门移到“浅蓝色”而不是整个div上方时触发悬停效果。

预先感谢

：hover类无法正常运行

0 个答案: