怎么样实现当鼠标移动到一个地方, 一个隐藏的元素显示?
pre-requests Link to heading
- A 元素和 B 元素有相同的父亲
- B 默认隐藏, A 默认显示
- 当鼠标移动到 A 身上, A 的父亲获得 hover 的状态
.father:hover .b 来实现.
例子 Link to heading
<div class="father">
<div class="brother-showing">
....
<div>
<div class="element">
.....
</div>
</div>
.element{
display:none; //元素默认是隐藏的
}
//当鼠标经过兄弟元素brother-showing时,也就是经过父级father的时候。父级获得hover状态,在父级hover的基础上写element的样式:
.father:hover .element{
display:block ;
}