html - 2 Div 的一个隐藏并出现在 2nd 的悬停上

Question

我有 2 个 div，我们称它们为 div A 和 div B

我想隐藏 Div B，当你将鼠标悬停在 div a 上时，div b 会出现，然后当你不再将鼠标悬停在它上面时消失......不确定要放什么。

Answer 1

像这样的 HTML:

<div class="a">
   This is div a.
</div>
<div class="b">
   This is div b.
</div>

你可以像这样使用 CSS:

.b {
  display:none;
}
.a:hover + .b {
  display:block;
}

因此 B div 开始时使用 display:none 隐藏，但是当您将鼠标悬停在 A div 上时，它会通过 display:block 显示。

Fiddle example

注意:如果 DIV 中的 div 不是直接相邻的，您需要将 + 替换为 ~ 以获得相同的效果。