大佬教程收集整理的这篇文章主要介绍了绑定到 class 和 id 时，Hover 不起作用，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我有一个 div，我试图对悬停做出反应，但我将它绑定到一个类和一个 ID。
#levelBox1 { left: 150px; position: absolute; BACkground-color: rgb(0,228,0); border-radius: 15px; Box-shadow: 1px 1px 4px,inset 0 0 10px rgb(255,255,255); wIDth: 250px; height: 390px; z-index: -5; } .levelBox { position: relative; z-index: 20; } .levelBox:hover,.levelBox:active { Box-shadow: inset 0 0 5px rgb(255,255); wIDth: 105%; height: 105%; }@H_450_10@<div ID="thirdbody"> <div class="levelBox" ID="levelBox1"> <center> <h1 class="levelBoxheader"> Beginner </h1> <p class="levelBoxtext"> Features: <br> - aiming <br> - cps <br> - W-tapPing <br> - BlockhitTing <br> - Basic explanations </p> </center> </div>@H_450_10@
当我删除 CSS 中的 ID 时，它解决了问题，但我没有允许我同时执行这两项操作的解决方案。我尝试将 :hover 更改为 div 的 ID，但变化不大。
这是一个简单的 CSS specificity 问题。您的悬停和活动 CSS 规则将被覆盖，因为它们并不比您之前定义的规则更具体。增加特异性，它们就起作用了：
#levelbox1 { left: 150px; position: absolute; BACkground-color: rgb(0,228,0); border-radius: 15px; box-shadow: 1px 1px 4px,inset 0 0 10px rgb(255,255,255); width: 250px; height: 390px; z-index: -5; } .levelbox { position: relative; z-index: 20; } #thirdbody .levelbox:hover,#thirdbody .levelbox:active { box-shadow: inset 0 0 5px rgb(255,255); width: 105%; height: 105%; }@H_450_10@<div id="thirdbody"> <div class="levelbox" id="levelbox1"> <center> <h1 class="levelboxheader"> Beginner </h1> <p class="levelboxtext"> Features: <br> - Aiming <br> - Cps <br> - W-tapping <br> - BlockhitTing <br> - Basic explanations </p> </center> </div>@H_450_10@
以上是大佬教程为你收集整理的绑定到 class 和 id 时，Hover 不起作用全部内容，希望文章能够帮你解决绑定到 class 和 id 时，Hover 不起作用所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。