从元素中删除'：hover'CSS行为
hover在一个元素上时，我有CSS更改格式。
HTML：
<div class="test"> blah </div> CSS：
.test:hover { border: 1px solid red; }
在某些情况下，我不想在hover上应用CSS。 其中一种方法就是使用jQuery从div中删除CSS类，但是这会破坏其他的东西，因为我也使用这个类来格式化它的子元素。
所以这让我质疑：有没有办法从元素中删除“hover”CSS样式？
我会用两个class。 保留你的testing类，并添加第二个名为testhover的类，你只能添加到你想要hover的类 – 与testing类一起。 这不是直接问你的问题，但没有更多的上下文感觉是最好的解决scheme，可能是最干净和最简单的方法。
例：
HTML：
<div class="test"> blah </div> <div class="test"> blah </div> <div class="test testhover"> blah </div>
CSS：
.test { border: 0px; } .testhover:hover { border: 1px solid red; }
使用:not伪类来排除您不希望hover的类应用于：
小提琴
<div class="test"> blah </div> <div class="test"> blah </div> <div class="test nohover"> blah </div> .test:not(.nohover):hover { border: 1px solid red; }
这就是你想在一个CSS规则！
一种方法是添加：
pointer-events:none;
到您要禁用hover的元素。
（注意：这也会禁用该元素上的JavaScript事件，点击事件实际上会落在后面的元素上）。
浏览器支持 （截至2012年10月17日，为94.62％）
这似乎更清洁
/** * This allows you to disable hover events for any elements */ .disabled { pointer-events: none; /**<-----------*/ opacity: 0.2; } .button { border-radius: 30px; padding: 10px 15px; border: 2px solid #000; color: #FFF; background: #2D2D2D; text-shadow: 1px 1px 0px #000; cursor: pointer; display: inline-block; margin: 10px; } .button-red:hover { background: red; } .button-green:hover { background:green; }
<div class="button button-red">Im a red button hover over me</div> <br/> <div class="button button-green">Im a green button hover over me</div> <br/> <div class="button button-red disabled">Im a disabled red button</div> <br/> <div class="button button-green disabled">Im a disabled green button</div>
添加一个新的.css类：
#test.nohover:hover { border: 0 }
和
<div id="test" class="nohover">blah</div>
更“特定”的CSS规则获胜，所以这个边界：0版本将覆盖其他地方指定的通用。
你想保持select器，所以添加/删除它将无法正常工作。 也许你可以使用原始的select器来根据一些标准对这个元素应用新的CSS规则，而不是写一个硬又快的CSSselect器（或者两个）：
$(".test").hover( if(some evaluation) { $(this).css('border':0); } );
