如何在 div 上制作悬停效果

Question

我想在我的整个 div（不是图像）上添加一个悬停效果，（像这个例子）但不起作用，我需要保留这种形式的 html，因为有其他属性。 我需要你的帮助...谢谢。

 /** DIV WITH EFFECT */ <div class="col-md-3 col-md-3 main-sidebaramberse sidebaramberse siverge"> <ul id="main-sidebarambersese" class="siverge"> <li id="armonioso-text-2" class="widget widget_armonioso_text"> <div class="armonioso- textwidget-wrapper armonioso-textwidget-no-paddings"> <div class="armonioso-textwidget" data-style="background-image: url(www.myweb.com/myimage.jpg);padding: 40px 30px ;color: #ffffff;text-align: center;"> <h5>ONE TOPIC</h5> <h3>SECOND</h3> <p>Something to say... <p><a class="btn alt" href="/authors.html" target="_self">Authors</a> </div> </div> </li> </ul> </div> /** DIV WITH EFFECT */

Answer 1

在 div 上放置一个 id 并在您的 css 文件中使用下一个选择器：

#div's_id:hover{

    /*effects u wish*/
}

如果你看不到效果，可能是因为其他元素在上面。

Answer 2

您在寻找特定的效果吗？

如果没有，您想要实现的只是在给定 div 上的悬停效果，只需使用您拥有的类siverge ？

在您的 css 文件中应用悬停效果，如下所示：

div.siverge:hover {

 /*styles to be applied on hover*/

};