代码之家 › 专栏 › 技术社区 › lefrost

影响悬停时在元素之前声明的元素[重复]

hover css html

0

lefrost · 技术社区 · 7 年前

给定HTML代码:

<html>
  <body>
    <div class="one"></div>
    <div class="two"></div>
  </body>
</html>

以及CSS代码:

.one {height: 50px; width: 50px; background-color: orange;}
.two {height: 50px; width: 50px; background-color: yellow;}
.one:hover ~ .two {opacity: 0.5;}
.two:hover ~ .one {opacity: 0.5;}

我试着这么做:当一个 div 是悬停在上面的,它会影响到另一个

当我悬停在 .one , .two 二号 , 是不影响。

为什么会这样?我该如何解决这个问题?

1 回复 | 直到 7 年前

1

0

Aman 7 年前

使用 + 财产。它影响下一个兄弟姐妹,而不是相反。

.one:hover + .two {}