小编Ale*_*ile的帖子

仅使用CSS在悬停时隐藏同级div

我对一种使CSS(no javascript)展示div您之外的或元素的方式感兴趣:hover,例如:

#divid {
  display: none;
}
a:hover #divid {
  display: block;
}
Run Code Online (Sandbox Code Playgroud)
<a href="#">Hover me!</a>
<div id="divid">Hello there, fellow friend!</div>
Run Code Online (Sandbox Code Playgroud)

我很好奇,因为当您将鼠标悬停在某个菜单元素上时我想做点事情,您会在浏览器的左边缘绘制搜索栏(它将是position: fixed;)。


编辑:

我认为上面的代码并不是我想要的。

这是实际的代码,因为答案始终无法正常工作。

#fixed2 a:hover + .nav {
  background: black;
}
#options:hover + #search_text {
  position: fixed;
  top: 0;
  left: 0;
}
Run Code Online (Sandbox Code Playgroud)
<ul class="nav">
  <li id="left" class="big">
    <a href="#">
      <img width="35px" src="square.png" />
    </a>
  </li>
  <li id="left" class="arrow">
    <a href="#">
      <img src="arrow.png" />
    </a>
  </li>
  <li id="left">
    <a href="#">
      <img width="17px" …
Run Code Online (Sandbox Code Playgroud)

html css hover css-selectors

3
推荐指数
1
解决办法
3928
查看次数

标签 统计

css ×1

css-selectors ×1

hover ×1

html ×1