在悬停时隐藏div的子元素

Question

有没有办法让这项工作.我想将鼠标悬停在外部div并隐藏子元素而不使用javascript.这样的事情可能吗？

.fullwrap:nth-child(1):hover { 
    display: none; 
}

Answer 1

要隐藏子元素,您需要这样的结构:

#parent:hover .yourchild {
   display:none;
}

#parent你的外部在哪里div并且有:hover动作,那么你只需匹配子元素使其隐藏.

在这种情况下,我猜你有一些像这样的结构:

<div class="fullwrap">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
</div>

然后隐藏一个孩子,你可以这样做:

.fullwrap:hover :nth-child(1) { 
  display: none; 
}