css - 在Ionic的div上悬停

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

        <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);
}

最佳答案

我测试了您的代码，它起作用了。当我将鼠标悬停在div上时，它的不透明度从0.7更改为0.4。那就是你想做什么？

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