Question

我创建一个网站，我有悬停效果的问题。我在开始页面上有3个div元素，我想在将这三个div中的一个徘徊时使透明的另外两个div变为透明。在Mozilla Firefox中，一切都运行良好，但在谷歌Chrome上它不会起作用（任何元素都不适用不透明度）。这是临时地址的网站 - http://letsdrink.fm4.pl/

这是我悬停这些元素的代码：

#center:hover a {
    opacity:0.2;
}

#center:hover a:hover {
    opacity:1;
}
#center:hover a:hover .start-element-more {
    background:#8f1fe7;
}

代码的一部分

<div id="center">
<a href="Serwis-Kawowy">
<div id="start-element">Serwis kawowy
<div class="start-element-more">+ czytaj więcej</div>
</div></a> 
<a href="Obsluga-Barmanska">
<div id="start-element2">
Obsluga Barmanska
<div class="start-element-more">+ czytaj więcej</div>
</div></a> 
<a href="Kursy-Szkolenia">
<div id="start-element3">Kursy i szkolenia
<div class="start-element-more">+ czytaj więcej</div>
</div></a>
</div>

你可以在firefox和chrome上查看 - 在firefox上一切正常。

Answer 1

您的修复：

#center:hover a,
#center:hover a > div {
    opacity:0.2;
}

Answer 2

#center:hover a,
#center:hover a >div {
    opacity: 0.2;
}
#center:hover a:hover,
#center:hover a > div:hover {
    opacity: 1;
}

CSS Hover div影响其他div在Google Chrome上工作

2 个答案:

您的修复：