css - 将鼠标悬停在 Ionic 中的 div 上

Question

我正在用 ionic 创建一个应用程序，我在主页上有两张照片。背景图像上有一个灰色滤镜。我希望在用户使用选项卡将不透明度从 0.7 更改为 0.4 时悬停。但是代码 :hover 在 Css 中不起作用。这是我的代码片段

        <a class="col-50 div2"  ui-sref="belege">
            <div class="opaq-bg"></div>
            <span>Belege</span>
        </a>

这里是css文件

#home  .div1{
    background-image: url(../img/checkliste.jpg);
    color: #fff;
    text-decoration: none;
}
#home  .div2{
    background-image: url(../img/belege.jpg);
    color: #fff;
    text-decoration: none;
}

.opaq-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(68, 68, 68, 0.7);
    z-index: 0;
}

.opaq-bg:hover {
    background-color: rgba(68, 68, 68, 0.4);
}

Answer 1

我测试了你的代码并且它有效。当我将鼠标悬停在 div 上时，它会将不透明度从 0.7 更改为 0.4。这就是你想要做的？

仅测试您单独放入问题中的代码以查看结果，然后尝试搜索其他代码是否会与此代码发生冲突。