Html CSS-在标记内的元素上使用鼠标悬停？

我想在标记中使用hover进行几个div

举个例子

<a href="#">
<div class="nextmatch_wrap">
   <div class="clan12w">
      <div class="TeamLogos">
         <div class="Team" id="TeamContainer">
            <img src="#">
         </div>
      </div>
   </div>
   <div class="clan12w">
      <div class="TeamLogos">
         <div class="Team" id="TeamContainer">
            <img src="#">
         </div>
      </div>
   </div>
</div>

---

它可以工作，但当鼠标位于页面中的任何位置时，鼠标悬停就像一直处于打开状态，但当您将鼠标移出浏览器页面时，鼠标悬停就会消失，有什么想法吗？

您的选择器不正确，

这是您需要完全用于所需内容的css：

a:hover #TeamContainer, a:hover .TeamLogos{
    border:solid 1px #25c2f5;
}

css选择器中的“，”表示将同一样式应用于多个元素，并使用它来分隔这些元素（即：在我的例子中，我将该边框样式应用于被悬停的

标记内的每个

#TeamContainer

，以及被悬停的

标记内的每个

.TeamLogos

。）

您应该在被悬停的元素之后立即添加

：hover

，尽管该元素将受到影响

样式选择器的问题在于，逗号之间只有

：hover

，因此这是在选择任何悬停的元素

---

别忘了关闭

标记。

抱歉，仍然不起作用：/当我这样添加它时，悬停不起作用，我已经关闭了a标记，只是我忘了在这里发布：）对不起，TeamLogos是一个类而不是ID，你应该使用“.TeamLogos”而不是“#TeamLogos”。我错了！这行吗？a:hover#TeamContainer，a:hover.TeamLogos{border:solid 1px#25c2f5；}啊，是的，这是一个类，没有id xD，不用担心，这是我的错，我甚至没有看，我只是复制了粘贴，实际上我不需要这样做才能工作。nextmatch#wrap:hover#TeamContainer{border color:rgb（255，36，35）！重要；}

a:hover #TeamContainer, a:hover .TeamLogos{
    border:solid 1px #25c2f5;
}