透明的悬停在JSFiddle上工作但不在网站上

Question

我决定制作一个JSFiddle来向你们展示出了什么问题，但它最终起作用了，我使用完全相同的代码但是当它悬停在网站上时仍然具有1的不透明度。我已经上传了我到目前为止的网站，以显示我的意思。这是JSFiddle和html代码。

<div class="wide-col gjw">
    <div class="portfolio-info">
        <p class="portfolio-title">GJW Website v1.0</p>
        <p class="portfolio-desc">The first version of my portfolio website</p>
        <a class="portfolio-button" href="#">View Brief</a>
    </div>
</div>

JSFiddle通过使用透明的悬停颜色来完成我想要的操作。现在，当我在我的网站上使用相同的代码时，不透明度已满，如here

所示

我不明白为什么它不会在我的网站上而是在小提琴上呢？我不认为还有其他任何阻碍它的代码......

提前干杯

Answer 1

opacity中指定的.gjw:hover .portfolio-info被您网站中的某些脚本覆盖。

删除/更正脚本或应用!important关键字来阻止此操作。

.gjw:hover .portfolio-info {
   opacity: 0.9 !important;
   ...
 }

Web控制台及其检查元素功能是您的朋友......