jQuery / css addClass() 样式覆盖以前的样式属性
我有一个 div，它的默认类给它一个绿色背景。当按下鼠标时，我想将背景更改为红色，直到松开鼠标。
我尝试添加一个具有红色背景颜色的类。新的类属性似乎不会覆盖现有属性。我在 .css 文件中的原始类之后列出了新类。
css
#calc_no { background-color: #cd9781; }
#calc_yes { background-color: #8fba8e; }
.button_click { background-color: red; }
jscript
$('.button').live('mousedown', function() {
$(this).addClass("button_click");
});
$('.button').live('mouseup', function() {
$(this).removeClass('button_click');
});
html
<div id="calc_yes" class="kp_button button">Yes</div>
I have a div with its default class giving it a green background. When the mouse is pressed, I want to change the background to red until the mouse is let go.
I have tried to addClass a class with a red background-color. The new class properties seem to not override the existing properties. I have the new class listed after the original in the .css file.
css
#calc_no { background-color: #cd9781; }
#calc_yes { background-color: #8fba8e; }
.button_click { background-color: red; }
jscript
$('.button').live('mousedown', function() {
$(this).addClass("button_click");
});
$('.button').live('mouseup', function() {
$(this).removeClass('button_click');
});
html
<div id="calc_yes" class="kp_button button">Yes</div>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
在CSS中，不同类型的选择器有不同的权重。例如，id 比类具有更大的权重，类比标签名称具有更大的权重。因此，基于 id 的样式将覆盖基于类的样式。
对于这个简单的情况，请尝试使用
!important关键字：http://www.w3.org/TR/CSS2/cascade.html#specificity
In CSS, different types of selectors have different weights. An id has greater weight than a class, which has greater weight than a tag name, for example. So, your id-based styles are overriding the class-based styles.
For this simple case, try using the
!importantkeyword:http://www.w3.org/TR/CSS2/cascade.html#specificity
问题是 ids 覆盖了类定义。更改类中的背景而不是 ids
the problem is that ids override class definitions. change the background in classes instead of ids
id> 您可以
使用 .calc_no 和 .calc_yes 代替
ids > classes
you could use .calc_no and .calc_yes instead