如何在另一个<div>上悬停时显示<div>

Question

我使用过bootstrap和css，这是我的代码

<div class = "row" id="parent"=>

  <div class="col-md-8" id="ClildDiv1">

  //Some Content

</div>

<div class="col-md-4" id="ChildDiv2" style="display:none">

  //Some Content

<div>

</div>

现在我想悬停在上面 <div class="row Parent> 在这种情况下，所有的孩子都应该可见 <div class="col-md-4 ChildDiv2">

任何帮助都会受到赞赏我想通过CSS样式实现这一目标

Answer 1

你想要一个兄弟选择器。一般兄弟~或下一个兄弟+

.ClildDiv1:hover ~ .ChildDiv2 {
    display: block;
}

请参阅fiddle here

或者，任何子div的父级悬停都是

.Parent:hover > div {
  display: block;
}