从元素中删除'：hover'CSS行为 [英] Remove ':hover' CSS behavior from element

问题描述

当您将鼠标悬停在某个元素上时，我会使用CSS来更改格式。

I have CSS that changes formatting when you hover over an element.

HTML：

<div class="test"> blah </div>

CSS：

.test:hover {  border: 1px solid red; }

在某些情况下，我不想在悬停时应用CSS。一种方法是使用jQuery从div中删除CSS类，但这将打破其他事情，因为我也使用该类来格式化其子元素。

In some cases I don't want to apply CSS on hover. One way would be to just remove CSS class from the div using jQuery but that would break other things since I also using that class to format its child elements.

所以我的问题是：有没有办法从一个元素中删除hovercss样式？

So that led me to question: Is there a way to remove 'hover' css styling from an element?

推荐答案

我会使用两个类。保持你的测试类，并添加第二个类testhover，你只添加到你想悬停的测试类旁边。这不是你的问题，但没有更多的上下文感觉像最好的解决方案，可能是最干净，最简单的做法。

I would use two classes. Keep your test class and add a second class called testhover which you only add to those you want to hover - alongside the test class. This isn't directly what you asked but without more context it feels like the best solution and is possibly the cleanest and simplest way of doing it.

示例：

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

这篇关于从元素中删除'：hover'CSS行为的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！